@import "../iconfont/iconfont.css";
.fyc { display: -webkit-flex; display: flex; display: -webkit-box; display: box; -webkit-box-orient: vertical; box-orient: vertical; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-justify-content: center; justify-content: center; -webkit-box-pack: center; box-pack: center }
.fwbet { display: flex; flex-wrap: wrap; justify-content: space-between }
.wrap { width: 88vw; max-width: 1600px; margin-left: auto; margin-right: auto }
@media (max-width:639px) {
.wrap { width: 92vw }
}
.w1400 { width: 88vw; max-width: 1600px; margin-left: auto; margin-right: auto; max-width: 1400px }
@media (max-width:639px) {
.w1400 { width: 92vw }
}
.ver>* { display: inline-block; vertical-align: middle }
.table-cell { display: table; width: 100% }
.table-cell>* { display: table-cell; vertical-align: middle }
.row-pv0 { margin-left: 0; margin-right: 0 }
.row-pv0>* { padding-left: 0; padding-right: 0 }
.mv0 { margin-left: 0!important; margin-right: 0!important }
.pv0 { padding-left: 0!important; padding-right: 0!important }
.pt0 { padding-top: 0px !important }
.pb0 { padding-bottom: 0px !important }
.mb0 { margin-bottom: 0 !important }
.mt0 { margin-top: 0!important }
.bggray { background: #f6f6f6 }
.bgf { background: #fff }
.c { color: #E62129 }
.bgc { background-color: #E62129 }
.cf { color: #fff }
.c-red { color: #000 }
.bg-red { background: #000 }
.hv:hover { color: #E62129 }
.hvf:hover { color: #fff }
.hvbg0:hover { background: #000; color: #fff }
.bghover { transition: .6s }
.bghover:Hover { background-color: #E62129; color: #fff }
.l { border: 1px solid #f2f2f3 }
.lb { border-bottom: 1px solid #f2f2f3 }
.lt { border-top: 1px solid #f2f2f3 }
.coverbox { position: relative; display: block; overflow: hidden }
.coverbox .coverimg { width: 100%; height: 100%; position: absolute; left: 0; top: 0; background-repeat: no-repeat; background-size: contain; background-position: center; z-index: 1; transition: transform .6s ease 0s }
.coverbox .coverimg.cover { background-size: cover }
.coverbox ._bg { width: 100%; visibility: hidden; display: block }
@media (min-width:993px) {
.coverbox.scale:hover .cover-tip { opacity: 1; filter: alpha(opacity=1) }
.coverbox.scale:hover .coverimg { transform: scale(1.05, 1.05) }
.coverbox.scale:hover .icon-bofang1 { font-size:.6rem
}
}
.cover-tip { width: 100%; height: 100%; position: absolute; left: 0; top: 0; opacity: 0; filter: alpha(opacity=0); transition: all .4s ease 0s; z-index: 55 }
.cover-tip .bgbox { display: block; width: 100%; height: 100%; background-color: #000; opacity: .6; filter: alpha(opacity=60) }
.cover-tip .bgbox.blue { background-color: rgba(0,161,230,0.8) }
.cover-tip .stit { font-size: 16px; line-height: 30px; width: 100%; text-align: center; position: absolute; left: 0; top: 50%; margin-top: -15px; color: #fff }
.cover-tip .stit { font-size: 16px; line-height: 30px; width: 100%; text-align: center; position: absolute; left: 0; top: 50%; margin-top: -15px; color: #fff }
.cover-tip .line { display: inline-block; width: 100px; height: 1px; background-color: #f2f2f2; position: absolute; left: 50%; margin-left: -50px; transition: all .6s ease 0s }
.cover-tip .linet { top: 0 }
.cover-tip .lineb { bottom: 0 }
.cover-tip:hover .line { width: 6px; margin-left: -3px; opacity: .6; filter: alpha(opacity=60) }
.iconfont { font-size: inherit }
.cover-box ._bg { width: 100% }
.w1440 { width: 88vw; max-width: 1600px; margin-left: auto; margin-right: auto }
@media (max-width:639px) {
.w1440 { width: 92vw }
}
@media (min-width:1680px) {
.w1440 { max-width: 1440px }
}
.pt0 { padding-top: 0 !important }
.c { color: #E62129 }
.swiper-pagination-bullet-active { background-color: #E62129 !important }
.cItem:not(.active) { display: none }
.medium { font-family: medium }
.bsBox { box-sizing: content-box }
.bsBox>* { box-sizing: content-box }
.pagination { text-align: center; display: block }
.pagination li { margin: 0 2px }
@media (max-width:480px) {
.pagination li { margin: 0 2px }
.pagination li>* { padding: 5px 12px !important }
}
.pagination .active>a, .pagination .active>span, .pagination .active>a:hover, .pagination .active>span:hover, .pagination .active>a:focus, .pagination .active>span:focus { color: #fff; background-color: #E62129 }
.pagination li>a, .pagination li>span { float: none; display: inline-block; cursor: pointer; color: #000; border-radius: 0 !important; padding: 6px 12px; border: 1px solid #dddddd }
.pagination>li>a:hover, .pagination>li>span:hover, .pagination>li>a:focus, .pagination>li>span:focus { z-index: 2; color: #fff; background-color: #E62129 }
.pagination .active>a, .pagination .active>span, .pagination .active>a:hover, .pagination .active>span:hover, .pagination .active>a:focus, .pagination .active>span:focus { color: #fff; background-color: #E62129 }
.pagination li>a, .pagination li>span { float: none; display: inline-block; cursor: pointer; color: #333; padding: 6px 12px }
.pagination>li>a:hover, .pagination>li>span:hover, .pagination>li>a:focus, .pagination>li>span:focus { z-index: 2; color: #fff; background-color: #E62129 }
#totop { width: 50px; height: 50px; background: url('../images/top.png') no-repeat center center; background-color: #a8a8a8; background-color: rgba(0,0,0,0.3); position: fixed; right: 50px; bottom: 50px; z-index: 5555; cursor: pointer; border-radius: 50%; transition: .6s; opacity: 0; transform: translateY(20px) }
@media (max-width:640px) {
#totop { right: 10px; bottom: 10px; width: 40px; height: 40px; background-size: 20px }
}
@media (min-width:768px) {
#totop:hover { background-color: #E62129 }
}
#totop.show { transform: translateY(0); opacity: 1 }
main { margin-top: 0px; overflow: hidden }
@media (max-width:768px) {
main { margin-top: 0px }
}
header { background: rgba(0,0,0,0.5); transition: .6s; position: fixed !important; left: 0; right: 0; top: 0; z-index: 99; position: relative }
header .logo { width: 113px; height: 100%; background: url('../images/logo.png') no-repeat left center; display: block; transition: .6s }
@media (max-width:768px) {
header .logo { background-size: auto 90% }
}
.head_wrap { width: 88vw; max-width: 1600px; margin-left: auto; margin-right: auto; max-width: 1920px; transition: .6s; text-align: center; display: -webkit-flex; display: flex; display: -webkit-box; display: box; height: 80px }
@media (max-width:639px) {
.head_wrap { width: 92vw }
}
@media (max-width:1280px) {
.head_wrap { width: 92vw }
.head_wrap .home_nav_li { display: none }
}
@media (max-width:992px) {
.head_wrap { justify-content: space-between }
}
@media (max-width:768px) {
.head_wrap { height: 60px }
}
.head_wrap .nav_li { overflow: hidden }
.head_wrap .nav_li.active .header_nac { color: #E62129 }
.head_wrap .nav_li:hover { overflow: visible }
.head_wrap .nav_li:hover .header_nac { color: #E62129 }
.head_wrap .nav_li:hover .header_nac::after { border-bottom-color: #E62129 }
.head_wrap .nav_li:hover .drop { opacity: 1 }
.header_nav { min-width: 0; -webkit-box-flex: 1; -webkit-flex-grow: 1; -ms-flex-positive: 1; flex-grow: 1; -webkit-flex-shrink: 1; -ms-flex-negative: 1; flex-shrink: 1; transition: .6s; font-size: 16px; overflow: hidden; height: 80px }
.header_nav:hover { overflow: visible }
.header_nav .header_inner { display: -webkit-flex; display: flex; display: -webkit-box; display: box; -webkit-align-items: center; align-items: center; -webkit-box-align: center; box-align: center; -webkit-box-pack: center; box-pack: center; -webkit-justify-content: center; justify-content: center; height: 80px }
@media (min-width:1361px) {
.header_nav .header_inner { position: relative }
}
@media (max-width:1200px) {
.header_nav .header_inner { justify-content: space-between }
}
.header_nav .nav_li { font-size: 18px }
@media (max-width:1280px) {
.header_nav .nav_li { font-size: 17px }
}
.header_nav .nav_li:not(.good_nav) { position: relative }
.header_nav .nav_li+.nav_li { margin-left:.38rem
}
@media (max-width:1360px) {
.header_nav .nav_li+.nav_li { margin-left:.26rem
}
}
.header_nav .nav_li:hover .pc-menu-drop, .header_nav .nav_li.open .pc-menu-drop { opacity: 1; height: auto; top: 80px; z-index: 55; display: block }
.header_nav .header_nac { height: 80px; line-height: 80px; display: block; position: relative; padding: 0 5px; color:#FFF }
@media (min-width:1680px) {
.header_nav .header_nac { padding: 0 15px }
}
.header_nav .header_nac::after { content: ''; display: block; width: 0; height: 0; border: 6px solid transparent; position: absolute; left: 50%; transform: translateX(-50%); z-index: 5; bottom: 0 }
.header_nav .drop { position: absolute; left: 50%; transform: translateX(-50%); z-index: 5; top: 100%; min-width: 116px; transition: .6s; opacity: 0; white-space: nowrap; background: #fff; z-index: 55; font-size: 14px; box-shadow: 0 5px 8px rgba(0,0,0,0.03); padding: 14px 0; border-top: 2px solid #E62129; text-align: left }
.header_nav .drop a { overflow: hidden; display: block; line-height: 36px; padding: 0 30px }
.header_nav .drop a:hover { color: #E62129 }
.header_links { display: -webkit-flex; display: flex; display: -webkit-box; display: box; -webkit-align-items: center; align-items: center; -webkit-box-align: center; box-align: center; font-size: 16px }
@media (max-width:639px) {
.header_links { display: none }
}
.header_links .iconfont { font-size: 18px; margin-right: 2px }
.header_links a { display: block; padding: 0 12px; position: relative; transition: .6s }
.header_links a>* { display: inline-block; vertical-align: middle }
.header_links a:last-child { padding-right: 0 }
.header_links a:hover { color: #E62129 }
.header_links a+a::before { content: ''; display: block; width: 1px; height: 18px; border-left: 1px dotted #999999; position: absolute; top: 50%; transform: translateY(-50%); z-index: 5; left: 0 }
.pc-menu-drop { position: absolute; left: 50%; transform: translateX(-50%); z-index: 5; top: 80px; transition: .3s; opacity: 0; overflow: hidden; background: #fff; min-width: 1200px; display: none; box-shadow: 0 10px 10px rgba(0,0,0,0.2) }
@media (max-width:1679px) {
.pc-menu-drop { transform: none; position: fixed; left: 0; right: 0; width: 100vw }
}
.pc-menu-drop .drop-inner-wrap { border-top: 2px solid #E62129; position: relative; padding: 0 30px; z-index: 55 }
.pc-menu-drop .drop-inner { z-index: 55; width: 100%; text-align: left; display: flex; flex-wrap: wrap; align-items: stretch }
.pc-menu-drop li { width: 25%; padding:0 .2rem
}
@media (max-width:1679px) {
.pc-menu-drop li { width: 33.33% }
}
.pc-menu-drop .inner { display: flex; padding:.4rem 0;
height: 100%; border-bottom: 1px solid #f2f2f3 }
.pc-menu-drop .inner .img { width: 80px; height: 80px; margin-right: 18px }
.pc-menu-drop dt { font-size: 16px; font-weight: bold; margin-bottom: 10px }
.pc-menu-drop dt a:hover { color: #E62129 }
.pc-menu-drop dd { font-size: 14px }
.pc-menu-drop dd a { display: block; line-height: 2; color: #666 }
.pc-menu-drop dd a:hover { color: #E62129 }
.header_btn { font-size: 18px; display: -webkit-flex; display: flex; display: -webkit-box; display: box; -webkit-align-items: center; align-items: center; -webkit-box-align: center; box-align: center; -webkit-box-pack: center; box-pack: center; -webkit-justify-content: center; justify-content: center }
.header_btn .offer { margin-right: 34px; color: #fff }
.header_btn .offer:hover { color: #E62129 }
.header_btn .contact { background-color: #E62129; color: #fff; width: 92px; height: 40px; line-height: 40px; text-align: center }
.header_btn .contact .ac { color: #fff }
@media (max-width:992px) {
.header_btn .contact { height: 34px; width: 72px }
.header_btn .contact span { height: 34px; line-height: 34px }
}
.m-menus { width: 100%; max-width: 640px; height: 100vh; position: fixed; top: 85px; right: -100%; background: #fff; overflow: hidden; line-height: 32px; font-size: 15px; z-index: -999; padding-top: 2%; border-top: 1px solid #dedede }
@media (max-width:768px) {
.m-menus { top: 60px }
}
.m-menus .inner { height: calc((100vh - 85px)); padding: 10px 30px 40px; overflow-x: hidden; overflow-y: auto }
@media (max-width:768px) {
.m-menus { top: 60px }
.m-menus .inner { height: calc((100vh - 60px)) }
}
.m-menus a { display: block; color: #000 }
.m-menus.active { z-index: 999; transition: .6s; right: 0 }
.m-menus .item { cursor: pointer; transition: .3s; position: relative; text-align: center; border-bottom: 1px solid #dedede; text-align: left }
.m-menus .item .tit { display: -webkit-flex; display: flex; display: -webkit-box; display: box; -webkit-align-items: center; align-items: center; -webkit-box-align: center; box-align: center }
.m-menus .item>a, .m-menus .tit { display: block; line-height: 46px; position: relative; font-size: 16px }
.m-menus .tit { position: relative }
.m-menus .tit a { display: inline-block; min-width: 50vw }
.m-menus .tit .iconfont { position: absolute; right: 0; top: 50%; transform: translateY(-50%); color: inherit; padding: 0 10px; color: #000; font-size: 17px }
.m-menus .xs-menu { display: none; text-align: left }
.m-menus .xs-menu dd { line-height: 30px; font-size: 14px }
.m-menus .active .tit, .m-menus .open .tit { color: #E62129 }
.m-menus .active .tit a, .m-menus .open .tit a { color: #E62129 }
.m-menus .active .iconfont::before, .m-menus .open .iconfont::before { content: "\e627" }
.m-menus .active .xs-menu, .m-menus .open .xs-menu { padding: 0px 0 30px; border-top: 1px solid rgba(255,255,255,0.14) }
.m-menus .head_links_box { background: #fff; margin-top: 1rem; padding:.1rem .3rem
}
.m-menus .head_links { display: flex!important; justify-content: center }
.m-menus .head_links a {
padding:0 .2rem !important; display: block; flex: 1 }
.m-menus .head_links i { margin: 0 auto }
.menu_btn_box { min-width: 0; -webkit-box-flex: 1; -webkit-flex-grow: 1; -ms-flex-positive: 1; flex-grow: 1; -webkit-flex-shrink: 1; -ms-flex-negative: 1; flex-shrink: 1; display: -webkit-flex; display: flex; display: -webkit-box; display: box; -webkit-align-items: center; align-items: center; -webkit-box-align: center; box-align: center; -webkit-box-pack: center; box-pack: center; -webkit-justify-content: center; justify-content: center }
@media (max-width:639px) {
.menu_btn_box { display: -webkit-flex; display: flex; display: -webkit-box; display: box; -webkit-align-items: center; align-items: center; -webkit-box-align: center; box-align: center; -webkit-box-pack: end; box-pack: end; -webkit-justify-content: end; justify-content: end }
}
.menu_btn { width: 50px; height: 50px; z-index: 101; cursor: pointer; transform-origin: center center; position: relative; display: block; top: -5px }
.menu_btn i { position: absolute; width: 26px; height: 2px; background: #fff; left: 12px; display: block; transition: all .4s ease-in-out }
.menu_btn i:nth-of-type(1) { top: 20px }
.menu_btn i:nth-of-type(2) { top: 30px }
.menu_btn i:nth-of-type(3) { top: 40px; width: 14px }
.menu_btn.active i:nth-of-type(1) { transform: rotate(225deg) translate(-7px, -7px) }
.menu_btn.active i:nth-of-type(3) { opacity: 0 }
.menu_btn.active i:nth-of-type(2) { transform: rotate(-225deg) translate(0, 0) }
.menu_btn:hover i:nth-of-type(3) { width: 14px }
.bggray { background: #f6f6f6 }
footer { background-color: #282828; color: #999 }
@media (max-width:480px) {
footer { border-top-width:.1rem
}
}
footer a { color: #999 }
footer a:hover { color: #fff }
footer .ft-topper {
padding:.6rem 0 1rem; position: relative; z-index: 55 }
@media (min-width:1200px) {
footer .ft-topper { display: flex; justify-content: space-between }
}
@media (max-width:1199px) {
footer .ft-topper { padding-bottom:.4rem
}
}
@media (max-width:640px) {
footer .ft-topper { padding-top:.4rem
}
}
footer .ft-bottom { padding: 20px 0; border-top: 1px solid #3d3d3d }
@media (min-width:1200px) {
footer .ft-bottom .wrap { display: -webkit-flex; display: flex; display: -webkit-box; display: box; -webkit-align-items: center; align-items: center; -webkit-box-align: center; box-align: center; -webkit-box-pack: justify; box-pack: justify; -webkit-justify-content: space-between; justify-content: space-between }
}
footer .ft-bottom .copyright { line-height: 1.8 }
footer .ft-bottom .copyright a { display: inline-block !important }
@media (min-width:1200px) {
footer .ft-bottom .copyright span, footer .ft-bottom .copyright a { display: inline-block; margin-left: 10px }
footer .ft-bottom .copyright a:hover { color: #fff }
}
footer .ft-bottom .copyright span, footer .ft-bottom .copyright a { margin-right: 10px }
@media (max-width:480px) {
footer .ft-bottom .copyright { font-size: 13px }
}
.ft-navs { min-width: 0; -webkit-box-flex: 1; -webkit-flex-grow: 1; -ms-flex-positive: 1; flex-grow: 1; -webkit-flex-shrink: 1; -ms-flex-negative: 1; flex-shrink: 1 }
@media (min-width:768px) {
.ft-navs ul { display: flex; justify-content: space-between }
}
@media (min-width:768px) and (max-width:992px) {
.ft-navs ul { flex-wrap: wrap }
}
.ft-navs .navitem { min-width: 0; -webkit-box-flex: 1; -webkit-flex-grow: 1; -ms-flex-positive: 1; flex-grow: 1; -webkit-flex-shrink: 1; -ms-flex-negative: 1; flex-shrink: 1 }
@media (max-width:992px) {
.ft-navs .navitem { min-width: auto; margin-right:.6rem
}
}
@media (max-width:992px) and (min-width:769px) {
.ft-navs .navitem { margin-bottom:.5rem
}
}
.ft-navs .navitem h4 { font-size: 16px; position: relative; margin-bottom: 16px; color: #fff }
.ft-navs .navitem .icon-jia { float: right; transition: .3s; display: none; margin-right: 10px }
.ft-navs .navitem .info { line-height: 30px }
.ft-navs .navitem .info a { display: block }
@media (max-width:640px) {
.ft-navs .navitem .info a { color: #fff; opacity: .6 }
}
@media (max-width:991px) {
.ft-navs { margin-bottom:.5rem
}
.ft-navs .navitem { float: none; width: 100% }
.ft-navs .navitem .icon-jia { display: block }
.ft-navs .navitem h4 { position: relative; border-bottom: 1px solid rgba(255,255,255,0.14); height: 46px; line-height: 46px; margin: 0 }
.ft-navs .navitem .info { display: none; font-size: 15px; padding: 10px 30px; line-height: 2 }
.ft-navs .navitem.active h4 { font-weight: bold }
.ft-navs .navitem.active .iconfont { transform: rotate(135deg) }
}
@media (max-width:991px) and (max-width:640px) {
.ft-navs .navitem:last-child h4 { border-bottom: 0 }
}
@media (max-width:768px) {
.ft-navs .navitem h4 { font-size: 16px }
}
@media (min-width:1200px) {
.ft-follow { width: 4.5rem }
}
@media (max-width:1199px) {
.ft-follow { margin-bottom: 1rem; text-align: center }
}
@media (max-width:480px) {
.ft-follow { margin-bottom:.6rem
}
}
.ft-follow .logo { display: block; margin: 0 }
.ft-follow .txt { color: #fff; line-height: 2; margin: 20px 0 10px }
.ft-follow .follow-info { display: -webkit-flex; display: flex; display: -webkit-box; display: box; -webkit-align-items: center; align-items: center; -webkit-box-align: center; box-align: center; text-align: center }
@media (max-width:992px) {
.ft-follow .follow-info { display: -webkit-flex; display: flex; display: -webkit-box; display: box; -webkit-align-items: center; align-items: center; -webkit-box-align: center; box-align: center; -webkit-box-pack: center; box-pack: center; -webkit-justify-content: center; justify-content: center; margin-top:.5rem
}
}
.ft-follow .codeitem+.codeitem { margin-left: 20px }
.ft-follow img { display: block; margin: 0 auto 10px; width: 1.2rem }
@media (max-width:640px) {
.ft-follow img { width: 22vw }
}
.foot-report { background: url('../images/quote_bg.png') no-repeat center center; background-size: cover; padding:.66rem 0 .8rem
}
.foot-report .vhd { color: #fff }
@media (min-width:640px) {
.foot-report ul { display: flex }
.foot-report li { margin-bottom:.1rem
}
}
@media (min-width:1200px) {
.foot-report li { flex: 1; margin-right:.1rem
}
.foot-report .submitbox { flex: 1 }
}
@media (max-width:1199px) {
.foot-report ul { flex-wrap: wrap }
.foot-report li { padding:0 .1rem;
margin-bottom:.2rem
}
.foot-report .submitbox { width: 100% }
}
@media (min-width:481px) {
.foot-report .submit, .foot-report li { width: 50% }
}
.foot-report .submitbox { margin-right: 0 }
.foot-report .submitbox .submit { background: #000000; color: #fff; display: block; width: 100% }
@media (max-width:768px) {
.foot-report { padding:.5rem 2vw
}
.foot-report li { margin-bottom: 10px }
}
.foot-report input, .foot-report select, .foot-report .submit { background: #fff; height: 48px; font-size: 16px; border: 0; padding-left:.2rem;
border-radius: 0 }
@media (max-width:1200px) {
.foot-report input, .foot-report select, .foot-report .submit { font-size: 16px }
}
@media (max-width:768px) {
.foot-report input, .foot-report select, .foot-report .submit { height: 44px }
}
.foot-report .layui-form-select dl { top: 100%; margin-top: 2px }
.index_banner { position: relative; overflow: hidden; max-height: calc(100vh - 0px) }
.index_banner .swiper-pagination { bottom:.5rem
}
@media (min-width:1920px) {
.index_banner { height: 9.5rem }
}
.index_banner video { position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover; z-index: 555 }
.index_banner .bg { display: block; height: 100%; transition: all 5.6s cubic-bezier(.04, .79, 1, 1) !important; transform: scale(1.1); background-repeat: no-repeat; background-size: cover; background-position: center; width: 100% }
.index_banner .bg img { visibility: hidden }
@media (max-width:1920px) {
}
.index_banner .content { position: absolute; left: 50%; top: 50%; transform: translateX(-50%) translateY(-50%); z-index: 5; top: 45%; width: 88vw; text-align: center; color: #fff }
.index_banner .content h3 {
font-size:.45rem; font-weight: bold; letter-spacing: 2px; text-shadow: 0 0 10px rgba(0,0,0,0.2) }
.index_banner .content .desc { font-size: 18px; opacity: .76; padding-top:.16rem
}
@media (max-width:768px) {
.index_banner .content .desc { font-size: 16px }
.index_banner .content h3 { font-size:.5rem
}
}
@media (max-width:480px) {
.index_banner .content .desc { font-size: 14px }
}
.index_banner video { width: 100%; height: 100%; object-fit: cover }
.index_banner .swiper_pnext { width: 60px; height: 60px; line-height: 60px; text-align: center; border-radius: 50%; background: #fff }
.index_banner .swiper_pnext::after { font-size: 20px; color: #E62129 }
.index_banner .swiper_pnext:hover { background-color: #E62129 }
.index_banner .swiper_pnext:hover::after { color: #fff }
.index_banner .swiper-button-prev { left: 5vw }
.index_banner .swiper-button-next { right: 5vw }
.index_banner .swiper-pagination-bullet { background: #fff; opacity: 1 }
.index_banner .swiper-pagination-bullet-active { background-color: #E62129 }
.index_banner .swiper-slide-active .bg { transform: scale(1) }
@media (max-width:1199px) {
}
@media (max-width:768px) {
}
@media (max-width:480px) {
.index_banner .swiper-pagination { bottom: 6% }
}
.index_partner { background: url('../images/partent_bg.jpg') no-repeat center center; background-size: cover; padding: 1rem 0; text-align: center }
.index_partner dl { margin-left: -0.1rem !important; margin-right: -0.1rem !important }
.index_partner dl>* { padding-left:.1rem !important;
padding-right:.1rem !important;
margin-bottom:.2rem
}
.index_partner dd { width: 16.66%; float: left }
.index_partner dd p img { display: block }
.index_partner dd p:hover { box-shadow: 0 0 10px rgba(0,0,0,0.2); box-shadow: 0 0 10px rgba(0,0,0,0.1) }
@media (max-width:1360px) {
}
@media (max-width:992px) {
.index_partner dd { width: 25% }
}
@media (max-width:480px) {
.index_partner dd { width: 33.33% }
}
@media (max-width:450px) {
}
.index_partner img { width: 100% }
.index_partner .swiper-pagination-bullet { background: #7a7a7b; opacity: 1; width: 6px; height: 6px; margin: 1px 4px!important }
.index_partner .swiper-pagination-bullet-active { width: 8px; height: 8px; margin: 0 4px!important }
.index_partner .desc { font-size: 15px; color: #fff; line-height: 1.5; margin-bottom: 1rem }
@media (min-width:992px) {
.index_partner .desc { width: 80%; margin-left: auto; margin-right: auto }
}
.index_partner .swiper-container { padding-bottom:.9rem
}
.index_partner .coverbox { margin:0 .1rem
}
.vhd { margin-bottom:.4rem
}
.vhd h2 { font-size:.4rem
}
.vhd .desc { font-size: 16px; margin-top:.1rem
}
@media (max-width:480px) {
.vhd h2 { font-size: 22px }
}
.index_solution { background: url('../images/solution_bg.png') no-repeat left top; background-size: contain; padding:.9rem 0 1.2rem
}
.index_solution .vhd { display: -webkit-flex; display: flex; display: -webkit-box; display: box; -webkit-align-items: center; align-items: center; -webkit-box-align: center; box-align: center; -webkit-box-pack: justify; box-pack: justify; -webkit-justify-content: space-between; justify-content: space-between }
.index_solution .pnext { width: 130px; margin-right: -10px; height: 48px; position: relative }
.index_solution .pnext>div::after { display: none }
.index_solution .pnext>div { border: 1px solid #bbbbbb; width: 48px; height: 48px; line-height: 48px; text-align: center; transition: .6s }
.index_solution .pnext>div.swiper-button-next, .index_solution .pnext>div:hover { border-color: #E62129; background-color: #E62129 }
.index_solution .pnext>div.swiper-button-next .iconfont, .index_solution .pnext>div:hover .iconfont { color: #fff }
.index_solution .pnext .iconfont { font-size: 20px; color: #666 }
@media (max-width:480px) {
.index_solution .pnext { height: 40; width: 110px }
.index_solution .pnext>div { width: 40px; height: 40px; line-height: 40px; text-align: center }
}
.swiper_solution { margin-left: -0.19rem; margin-right: -0.19rem }
.swiper_solution .coverbox { margin:0 .19rem
}
.swiper_solution li { width: 25% }
@media (max-width:992px) {
.swiper_solution li { width: 33.33% }
}
@media (max-width:768px) {
.swiper_solution li { width: 50% }
}
@media (max-width:480px) {
.swiper_solution { margin-right: -4vw }
.swiper_solution li { width: 70% }
}
@media (max-width:1200px) {
.swiper_solution { margin-left: -0.1rem; margin-right: -0.1rem }
.swiper_solution .coverbox { margin:0 .1rem
}
}
.solution_item .coverbox { display: block; position: relative; cursor: pointer }
.solution_item .coverbox .content { position: absolute; left: 0%; right: 0; padding: 0 7%; top: 70%; color: #fff; z-index: 55; transition: .6s }
@media (max-width:640px) {
.solution_item .coverbox .content { top: 58% }
}
@media (max-width:480px) {
.solution_item .coverbox .content { top: 15% }
}
.solution_item .coverbox .line { width: 20px; height: 3px; background: #fff; display: block; margin-bottom:.26rem
}
.solution_item .coverbox h3 { font-size: 24px; margin-bottom:.1rem;
overflow: hidden; white-space: nowrap; -o-text-overflow: ellipsis; text-overflow: ellipsis }
@media (max-width:1200px) {
.solution_item .coverbox h3 { font-size: 20px }
}
.solution_item .coverbox .en { font-size: 16px; margin-bottom:.4rem;
text-transform: uppercase }
.solution_item .coverbox .txt { line-height: 24px; height: 72px; word-break: break-all; display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; -webkit-line-clamp: 3; margin-bottom:.4rem;
transition: .6s }
@media (min-width:481px) {
.solution_item .coverbox .txt { height: 0; margin-bottom: 0 }
}
.solution_item .coverbox .more { width: 34px; height: 34px; display: block; transition: .6s; background: url('../images/arr2.png') no-repeat center center; background-size: contain }
.solution_item .coverbox .more:hover { background-image: url('../images/arr2_c.png') }
@media (min-width:481px) {
.solution_item .coverbox .more { opacity: 0; height: 0; width:.48rem;
height:.48rem
}
}
@media (min-width:481px) {
.solution_item .coverbox:hover .content { top: 15% }
.solution_item .coverbox:hover .txt { height: 72px; margin-bottom:.4rem
}
.solution_item .coverbox:hover .more { opacity: 1; height:.48rem
}
}
.solution_main { padding:.78rem 0 1rem
}
.solution_main .row { margin-left: -0.2rem !important; margin-right: -0.2rem !important }
.solution_main .row>* { padding-left:.2rem !important;
padding-right:.2rem !important;
margin-bottom:.4rem
}
@media (max-width:1360px) {
.solution_main .row { margin-left: -0.15rem !important; margin-right: -0.15rem !important }
.solution_main .row>* { padding-left:.15rem !important;
padding-right:.15rem !important;
margin-bottom:.3rem
}
}
@media (max-width:480px) {
.solution_main .row li { width: 100% }
}
@media (max-width:768px) {
.solution_main .coverbox { height: 300px }
}
@media (max-width:480px) {
.solution_main .coverbox { height: 180px }
.solution_main .coverbox .more, .solution_main .coverbox .txt { display: none!important }
.solution_main .coverbox .en { font-size: 14px; margin-top:.2rem
}
.solution_main .coverbox .content { position: absolute !important; left: 50% !important; top: 50% !important; transform: translateX(-50%) translateY(-50%) !important; z-index: 5 !important; width: 100% }
}
.index_brand {
padding:.8rem 0 .9rem; position: relative; background: url('../images/brand_bg.jpg') no-repeat center bottom }
@media (min-width:1200px) {
.index_brand .brand_img { position: absolute; right: 0; top: 0; bottom: 0; width: 50vw; background-repeat: no-repeat; background-position: right center; background-size: 100% 100%; z-index: 55 }
}
@media (max-width:1199px) {
.index_brand { background: none!important; padding: 0 }
.index_brand .leftbox { margin-bottom: 0!important }
}
.index_brand .leftbox { position: relative }
.index_brand h3 { color: #E62129; font-size:.3rem;
margin-bottom:.14rem
}
@media (max-width:992px) {
.index_brand h3 { font-size: 20px }
}
@media (min-width:1200px) {
.index_brand .bd { position: relative }
.index_brand .leftbox { width: 48% }
}
@media (min-width:1200px) and (max-width:1680px) {
.index_brand .leftbox { width: 47% }
}
@media (max-width:1199px) {
.index_brand .wrap { padding: 1rem 0 }
}
@media (max-width:1199px) {
.index_brand .leftbox { margin-bottom:.5rem
}
.index_brand .vmore { left: 50%; transform: translateX(-50%); margin-bottom:.5rem
}
}
.index_brand .info { font-size: 16px; color: #666; line-height: 30px; max-height: 90px; word-break: break-all; display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; -webkit-line-clamp: 3 }
.index_brand .info p { margin-bottom: 1em }
.index_brand .video { position: relative; box-shadow: 0 10px 20px rgba(0,0,0,0.2) }
.index_brand .video img { width: 100% }
.index_brand .video .play { width: 1.12rem; height: 1.12rem; background: url('../images/play.png') no-repeat center center; background-size: contain; position: absolute; left: 50%; top: 50%; transform: translateX(-50%) translateY(-50%); z-index: 5; cursor: pointer }
.datas { display: -webkit-flex; display: flex; display: -webkit-box; display: box; -webkit-align-items: center; align-items: center; -webkit-box-align: center; box-align: center; -webkit-box-pack: justify; box-pack: justify; -webkit-justify-content: space-between; justify-content: space-between; text-align: center; margin:.38rem 0 .48rem
}
@media (max-width:1680px) {
.datas { margin:.3rem 0 .4rem
}
}
@media (max-width:1199px) {
.datas {
margin:.8rem auto !important; width: 90% }
}
@media (max-width:1199px) and (min-width:480px) {
.datas {
margin:.5rem auto !important; width: 80%; max-width: 700px }
}
.datas .val {
font-size:.72rem; font-family: medium; color: #E62129; line-height: 1.1 }
@media (max-width:480px) {
.datas .val { line-height: 1.3; font-size:.8rem
}
}
.datas .val .xs { font-size: 14px }
.datas .unit { font-size: 16px; color: #494949; position: relative }
.datas .tit {
font-size:.2rem; color: #494949; position: relative; padding-top:.2rem;
display: inline-block }
@media (max-width:1200px) {
.datas .tit { font-size: 17px }
}
@media (max-width:480px) {
.datas .tit { font-size: 15px }
}
.datas dd:hover .tit::before { width: 100% }
.vmore { display: inline-block; width: 256px; height: 48px; border: 1px solid #bbbbbb; position: relative; transition: .6s; padding: 0 18px; line-height: 48px; letter-spacing: 1px }
.vmore .arr { background: url(../images/arr.png) no-repeat center; width: 12px; height: 12px; background-size: contain; position: absolute; right: 18px; top: 50%; transform: translateY(-50%); transition: .6s }
.vmore.hover { background-color: #E62129; color: #fff; transform: translateX(4px); border-color: #E62129 }
.vmore.hover .arr { background-image: url('../images/arr_f.png') }
@media (min-width:992px) {
.vmore:hover { background-color: #E62129; color: #fff; transform: translateX(4px); border-color: #E62129 }
.vmore:hover .arr { background-image: url('../images/arr_f.png') }
}
.vmore.center { position: relative; left: 50%; transform: translateX(-50%) }
@media (max-width:480px) {
.vmore { width: 200px; height: 42px; line-height: 42px }
.vmore .arr { width: 10px; height: 10px }
}
.index_do_wrap { background: url('../images/index_bg3.jpg') no-repeat center center; background-size: cover }
.index_do_wrap .nav_box { margin-left: -0.19rem !important; margin-right: -0.19rem !important }
.index_do_wrap .nav_box>* { padding-left:.19rem !important;
padding-right:.19rem !important;
margin-bottom:.38rem
}
@media (max-width:480px) {
.index_do_wrap .nav_box li { width: 100% }
}
.index_do_wrap .nav_box .coverbox { position: relative; cursor: pointer; padding:.7rem 7%
}
.index_do_wrap .nav_box .coverbox .content { position: absolute; left: 0%; width: 100%; padding: 0 7%; top: 15%; color: #fff; z-index: 55; transition: .6s }
@media (max-width:1200px) {
}
.index_do_wrap .nav_box .coverbox h3 { font-size: 30px; margin-bottom:.1rem
}
@media (max-width:1200px) {
.index_do_wrap .nav_box .coverbox h3 { font-size: 20px }
}
.index_do_wrap .nav_box .coverbox .txt { line-height: 24px; margin-bottom:.36rem
}
@media (max-width:640px) {
.index_do_wrap .nav_box .coverbox .txt { font-size: 13px }
}
.index_do_wrap .nav_box .coverbox .more { width: 34px; height: 34px; display: block; transition: .6s; background: url('../images/arr2.png') no-repeat center center; background-size: contain }
@media (min-width:481px) {
.index_do_wrap .nav_box .coverbox:hover .more { background-image: url('../images/arr2_c.png') }
}
.index_do { padding:1rem 0 .8rem
}
.index_do .nav_xs_box { display: flex; align-items: stretch }
.index_do .nav_xs_box li { min-width: 0; -webkit-box-flex: 1; -webkit-flex-grow: 1; -ms-flex-positive: 1; flex-grow: 1; -webkit-flex-shrink: 1; -ms-flex-negative: 1; flex-shrink: 1; background: #fff; padding:.4rem 2% .66rem;
border-top: 4px solid #fff; border-left: 1px solid #f6f6f6; border-right: 1px solid #f6f6f6 }
@media (max-width:1679px) {
.index_do .nav_xs_box { flex-wrap: wrap }
.index_do .nav_xs_box li { width: 33.33%; border-bottom: 2px solid #f6f6f6 }
}
@media (max-width:480px) {
.index_do .nav_xs_box li { width: 50%; padding:.4rem 5%
}
}
@media (max-width:460px) {
.index_do .nav_xs_box li h3 { font-size: 16px }
}
.index_do .nav_xs_box .icon {
width:.7rem;
height:.7rem; display: block; margin-bottom:.46rem;
position: relative; transition: none; z-index: 5; overflow: hidden }
.index_do .nav_xs_box .icon i { position: absolute; width: 100%; height: 100%; left: 0; -webkit-filter:drop-shadow(.7rem 0 0 #E62129);
filter:drop-shadow(.7rem 0 0 #E62129);
top: 0; background-repeat: no-repeat; background-size: contain; background-position: center; transition: none }
.index_do .nav_xs_box .en { font-size: 12px; color: #999 }
.index_do .nav_xs_box h3 { font-size: 20px; margin:.16rem 0 .5rem;
transform-origin: left center; transition: .6s }
@media (max-width:768px) {
.index_do .nav_xs_box h3 { font-size: 18px }
}
.index_do .nav_xs_box .vmore { width: 100%; background-color: #E62129; color: #fff; border-color: #E62129; opacity: 0; transition: .6s }
.index_do .nav_xs_box .vmore .arr { background-image: url('../images/arr_f.png') }
@media (max-width:640px) {
.index_do .nav_xs_box .vmore { display: none }
.index_do .nav_xs_box .icon { margin-bottom: 0 }
}
.index_do .nav_xs_box li:hover { border-top-color: #E62129 }
.index_do .nav_xs_box li:hover h3 { transform: scale(1.05); color: #E62129 }
.index_do .nav_xs_box li:hover .icon i { left: -0.7rem }
.index_do .nav_xs_box li:hover .vmore { opacity: 1 }
.index_compete { padding-bottom: 1rem }
.index_compete .row { margin-left: -0.2rem !important; margin-right: -0.2rem !important }
.index_compete .row>* { padding-left:.2rem !important;
padding-right:.2rem !important;
margin-bottom:.4rem
}
@media (max-width:1360px) {
.index_compete .row { margin-left: -0.15rem !important; margin-right: -0.15rem !important }
.index_compete .row>* { padding-left:.15rem !important;
padding-right:.15rem !important;
margin-bottom:.3rem
}
}
@media (max-width:480px) {
.index_compete .row { margin-left: -0.1rem !important; margin-right: -0.1rem !important }
.index_compete .row>* { padding-left:.1rem !important;
padding-right:.1rem !important;
margin-bottom:.2rem
}
}
.index_compete .inner { background: #fff; text-align: center; padding:.6rem 6%;
transition: .6s }
@media (min-width:1200px) {
.index_compete .inner:hover { transform: translateY(-10px) }
}
.index_compete .inner .ic1 { background: url('../images/inddex_e1.png') no-repeat center center }
.index_compete .inner .ic2 { background: url('../images/inddex_e2.png') no-repeat center center }
.index_compete .inner .ic3 { background: url('../images/inddex_e3.png') no-repeat center center }
.index_compete .inner .ic4 { background: url('../images/inddex_e4.png') no-repeat center center }
.index_compete .inner .ic { width: 1rem; height: 1rem; display: inline-block; background-size: contain }
.index_compete .inner h3 { font-size: 24px; margin:.24rem 0
}
.index_compete .inner .txt { font-size: 16px; line-height: 2.2; color: #666 }
@media (max-width:1199px) {
.index_compete .inner h3 { font-size: 20px }
.index_compete .inner .txt { font-size: 14px }
}
@media (max-width:480px) {
.index_compete .inner h3 { font-size: 18px; margin-bottom:.1rem
}
.index_compete .inner .txt { line-height: 1.76 }
}
.banner { position: relative; height: 5.6rem; overflow: hidden }
.banner .bg { position: absolute; width: 100%; height: 100%; left: 0; top: 0; z-index: 1; background-repeat: no-repeat; background-position: center; background-size: cover; transition: all 5.6s cubic-bezier(.04, .79, 1, 1) !important; transform: scale(1.1) }
.banner.animated .bg { transform: scale(1) }
.banner .content { position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 5 }
.banner .wrap { height: 100%; display: flex; align-items: center; position: relative; padding-bottom:.4rem;
color: #fff; justify-content: center; text-align: center }
.banner h2 { font-size:.4rem;
margin-bottom:.1rem
}
.banner .desc { font-size: 18px }
@media (max-width:480px) {
.banner .desc { font-size: 16px }
}
@media (max-width:480px) {
.banner { height: 4rem }
.banner h2 { font-size: 22px }
}
.crumbs { background: #f6f6f6; height: 38px; line-height: 38px }
.crumbs .icon-right { font-size: 12px }
@media (max-width:480px) {
.crumbs { display: none }
}
.crumbs a { color: #999999 }
.crumbs a:hover { color: #E62129 }
.crumbs._white { color: #fff }
.crumbs._white a { color: #fff }
.crumbs._white .home { background-image: url('../images/home.png') }
.crumbs.topper {
padding:.34rem 0; width: 88vw; max-width: 1600px; margin-left: auto; margin-right: auto }
@media (max-width:639px) {
.crumbs.topper { width: 92vw }
}
.menu_xs { margin-bottom:.5rem
}
.menu_xs .top { position: relative; display: -webkit-flex; display: flex; display: -webkit-box; display: box; -webkit-align-items: center; align-items: center; -webkit-box-align: center; box-align: center; -webkit-box-pack: center; box-pack: center; -webkit-justify-content: center; justify-content: center; border-bottom: 1px solid #f2f2f3 }
.menu_xs h2 {
height:.8rem;
line-height:.8rem; text-transform: uppercase; background-color: #E62129; color: #fff; margin-right:.5rem;
position: relative; cursor: pointer; min-width: 35%; padding-left: 4vw; font-size: 17px }
@media (max-width:640px) {
.menu_xs h2 { height: 1rem; line-height: 1rem; padding-right:.5rem;
margin-right:.5rem
}
}
.menu_xs h2 i { font-size: 12px; position: absolute; right:.2rem;
top: 50%; transform: translateY(-50%); color: #fff }
.menu_xs h4 { min-width: 0; -webkit-box-flex: 1; -webkit-flex-grow: 1; -ms-flex-positive: 1; flex-grow: 1; -webkit-flex-shrink: 1; -ms-flex-negative: 1; flex-shrink: 1; color: #E62129; font-size: 17px }
.menu_xs .dropinfo { background-color: #E62129; padding: 20px 0; color: #fff; display: none }
.menu_xs .dropinfo .wrap { display: flex; flex-wrap: wrap }
.menu_xs .dropinfo p { width: 50% }
.menu_xs .dropinfo a { color: #fff; font-size: 15px; padding: 5px 0; position: relative; display: inline-block }
.menu_xs .dropinfo a::after { content: ''; display: block; position: absolute; width: 0; height: 1px; background: #fff; bottom: 0; left: 0; transition: all .4s ease 0s; opacity: .8 }
.menu_xs .dropinfo a:hover::after, .menu_xs .dropinfo .active::after { width: 100% }
@media (max-width:768px) {
.menu_xs .dropinfo p { margin-bottom: 5px }
}
.menu_lg { border-bottom: 1px solid #f2f2f3; font-size: 16px; margin-bottom:.8rem
}
@media (max-width:380px) {
.menu_lg.xs_hiden { display: none }
}
.menu_lg .wrap { text-align: center }
@media (max-width:480px) {
.menu_lg .wrap { width: 96vw; display: -webkit-flex; display: flex; display: -webkit-box; display: box; -webkit-align-items: center; align-items: center; -webkit-box-align: center; box-align: center; -webkit-box-pack: justify; box-pack: justify; -webkit-justify-content: space-between; justify-content: space-between; font-size: 15px }
.menu_lg .wrap a { min-width: 0; -webkit-box-flex: 1; -webkit-flex-grow: 1; -ms-flex-positive: 1; flex-grow: 1; -webkit-flex-shrink: 1; -ms-flex-negative: 1; flex-shrink: 1; display: block; padding: 0 }
}
.menu_lg a { display: inline-block; line-height:.8rem;
padding:0 .2rem;
color: #666; position: relative }
.menu_lg a:hover { color: #E62129 }
@media (min-width:641px) {
.menu_lg a { margin:0 .2rem;
padding:0 .4rem
}
}
@media (max-width:480px) {
.menu_lg a { line-height: 1rem }
}
.menu_lg a::after { content: ''; display: block; position: absolute; width: 100%; height: 2px; left: 0; bottom: 0 }
.menu_lg .active { color: #E62129 }
.menu_lg .active::after { background-color: #E62129 }
.menu_lg+.menu_xs { position: relative; margin-top: -0.5rem }
.company_box { padding: 0 0 1.2rem }
.company_box.bg { background: url('../images/brand_bg.jpg') no-repeat right bottom }
@media (max-width:768px) {
.company_box.bg { background-size: 60vw }
}
@media (min-width:1680px) {
.company_box .topper { display: flex; align-items: center; justify-content: space-between }
.company_box .lbox { width: 46%; order: -1 }
.company_box .rbox { width: 50% }
}
.company_box .rbox h2 { font-size:.36rem
}
@media (max-width:768px) {
.company_box .rbox h2 { font-size: 22px }
}
.company_box .rbox .txt { font-size: 16px; color: #666; line-height: 1.76 }
.company_box .rbox .txt p { margin-top:.2rem
}
@media (max-width:1679px) {
.company_box .lbox { width: 100%; max-width: 600px; margin:.5rem auto
}
}
.company_box .datas { width: 70%; margin: 1rem auto 0 }
@media (max-width:600px) {
.company_box .datas { width: 85% }
}
.object_box { background: url('../images/object_bg.jpg') no-repeat center center; background-size: cover; text-align: center; color: #fff; padding:.8rem 0 1.7rem
}
.object_box .vhd { margin-bottom: 1rem }
.object_box .row { margin-left: 0 !important; margin-right: 0 !important }
.object_box .row>* { padding-left: 0 !important; padding-right: 0 !important; margin-bottom: 0 }
.object_box h5 { font-size:.24rem
}
.object_box .icon { display: inline-block; padding:.07rem;
border: 2px dotted #fff; border-radius: 50%; margin-bottom:.2rem;
transition: .6s }
@media (max-width:480px) {
.object_box .icon { border-width: 1px }
}
.object_box .ic1 { background: url('../images/ic_dx_1.png') no-repeat center center }
.object_box .ic2 { background: url('../images/ic_dx_2.png') no-repeat center center }
.object_box .ic3 { background: url('../images/ic_dx_3.png') no-repeat center center }
.object_box .ic4 { background: url('../images/ic_dx_4.png') no-repeat center center }
.object_box .ic {
width:.8rem;
height:.8rem; border-radius: 50%; display: block; background-color: #fff; background-size:.5rem
}
.object_box li:hover .icon { transform: rotate(360deg) }
.step_box { text-align: center; padding:.8rem 0 1.7rem
}
@media (max-width:640px) {
.step_box { padding-bottom:.3rem
}
}
.step_box .vhd { margin-bottom:.7rem
}
.step_box ul { display: flex }
@media (max-width:640px) {
.step_box ul { flex-wrap: wrap }
}
.step_box ul li { min-width: 0; -webkit-box-flex: 1; -webkit-flex-grow: 1; -ms-flex-positive: 1; flex-grow: 1; -webkit-flex-shrink: 1; -ms-flex-negative: 1; flex-shrink: 1; position: relative }
@media (max-width:640px) {
.step_box ul li { width: 25%; margin:0 0 .8rem !important
}
.step_box ul li .icon { border-left: 1px solid #fff }
}
.step_box ul li+li { margin-left: 1px }
.step_box ul .id { background-color: #E62129; width:.5rem;
height:.5rem;
line-height:.5rem;
border-radius: 50%; color: #fff; font-size:.3rem;
position: absolute; left: 50%; transform: translateX(-50%); z-index: 5; top: -0.25rem }
.step_box ul .icon { background-color: #E62129 }
.step_box ul .ic1 { background: url('../images/lc_1.png') no-repeat center center }
.step_box ul .ic2 { background: url('../images/lc_2.png') no-repeat center center }
.step_box ul .ic3 { background: url('../images/lc_3.png') no-repeat center center }
.step_box ul .ic4 { background: url('../images/lc_4.png') no-repeat center center }
.step_box ul .ic5 { background: url('../images/lc_5.png') no-repeat center center }
.step_box ul .ic6 { background: url('../images/lc_6.png') no-repeat center center }
.step_box ul .ic7 { background: url('../images/lc_7.png') no-repeat center center }
.step_box ul .ic8 { background: url('../images/lc_8.png') no-repeat center center }
.step_box ul .ic { height: 2rem; display: block; background-size:.7rem
}
@media (max-width:768px) {
.step_box ul .ic { height: 1.5rem }
}
.step_box ul h5 { font-size:.2rem;
margin-top:.2rem
}
@media (max-width:992px) {
.step_box ul h5 { font-size: 16px }
}
@media (max-width:768px) {
.step_box ul h5 { font-size: 14px }
}
.tj_form {
padding:.2rem 0 1.8rem; background: url('../images/tj_bg.jpg') no-repeat right bottom }
.tj_form .hd { margin-bottom:.7rem
}
.tj_form .hd .tit { color: #E62129; font-size:.24rem;
margin-bottom:.1rem
}
@media (max-width:1200px) {
.tj_form .hd .tit { font-size: 20px }
}
.tj_form .hd .desc { font-size: 16px; color: #666; line-height: 1.76 }
@media (max-width:480px) {
.tj_form .hd .desc { font-size: 15px }
}
.tj_form .layui-form { max-width: 800px }
.tj_form .layui-form-label { width: 100px }
@media (min-width:480px) {
.tj_form .layui-form-label { padding: 11px 15px }
}
.tj_form .layui-form-label em { color: red }
@media (min-width:480px) {
.tj_form .layui-input, .tj_form .layui-select, .tj_form .layui-textarea { height: 48px }
}
.tj_form .codebox { display: -webkit-flex; display: flex; display: -webkit-box; display: box; -webkit-align-items: center; align-items: center; -webkit-box-align: center; box-align: center }
.tj_form .codebox input { width: 2.8rem; margin-right: 10px }
.tj_form .codebox img { width: 100px; height: 44px; border: 1px solid #ccc }
@media (max-width:480px) {
.tj_form .layui-form-label { padding-left: 0; padding-right: 0; width: 70px }
.tj_form .layui-input-block { margin-left: 80px }
}
.tj_form .submitbox { padding-top:.2rem
}
.tj_form .submit { width: 240px; height: 48px; line-height: 48px; text-align: center; background-color: #E62129; color: #fff; font-size: 18px; cursor: pointer }
@media (max-width:480px) {
.tj_form .submit { font-size: 16px }
}
.tj_form .submit:hover { background: #000 }
.qy_box { padding: 1rem 0; position: relative; margin-top: -0.8rem }
.qy_box .topper { background: url('../images/yj_bg.jpg') no-repeat center center; background-size: cover; height: 6.48rem; text-align: center; color: #fff; padding: 0 6% 6%; margin-bottom:.6rem;
display: -webkit-flex; display: flex; display: -webkit-box; display: box; -webkit-box-orient: vertical; box-orient: vertical; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-justify-content: center; justify-content: center; -webkit-box-pack: center; box-pack: center }
.qy_box .topper h2 { font-size:.36rem;
margin-bottom:.34rem
}
.qy_box .topper .desc { font-size: 18px; line-height: 2 }
@media (max-width:992px) {
.qy_box .topper h2 { font-size: 30px }
}
@media (max-width:640px) {
.qy_box .topper { padding-left: 6%; padding-right: 6% }
.qy_box .topper h2 { font-size: 24px }
.qy_box .topper .desc { font-size: 16px }
}
.qy_box .row { margin-left: -0.2rem !important; margin-right: -0.2rem !important; display: flex; align-items: stretch; flex-wrap: wrap }
.qy_box .row>* { padding-left:.2rem !important;
padding-right:.2rem !important;
margin-bottom:.4rem
}
@media (max-width:1360px) {
.qy_box .row { margin-left: -0.15rem !important; margin-right: -0.15rem !important }
.qy_box .row>* { padding-left:.15rem !important;
padding-right:.15rem !important;
margin-bottom:.3rem
}
}
@media (max-width:1200px) {
.qy_box .row { margin-left: -0.1rem !important; margin-right: -0.1rem !important }
.qy_box .row>* { padding-left:.1rem !important;
padding-right:.1rem !important;
margin-bottom:.2rem
}
}
@media (max-width:480px) {
.qy_box .row li { width: 100% }
}
.qy_box .inner { background: #fff; text-align: center; padding:.6rem 6%;
height: 100%; transition: .6s }
@media (min-width:1200px) {
.qy_box .inner:hover .ic { transform: rotate(360deg) }
}
.qy_box .inner .ic1 { background: url('../images/qy_1.png') no-repeat center center }
.qy_box .inner .ic2 { background: url('../images/qy_2.png') no-repeat center center }
.qy_box .inner .ic3 { background: url('../images/qy_3.png') no-repeat center center }
.qy_box .inner .ic4 { background: url('../images/qy_4.png') no-repeat center center }
.qy_box .inner .ic { width: 1rem; height: 1rem; display: block; background-size: contain; transition: .6s; margin: 0 auto }
.qy_box .inner h3 { font-size:.3rem;
margin:.24rem 0 .1rem
}
.qy_box .inner .txt {
font-size:.18rem; line-height: 1.76; color: #666 }
@media (max-width:1280px) {
.qy_box .inner h3 { font-size: 20px }
.qy_box .inner .txt { font-size: 14px }
}
@media (max-width:480px) {
.qy_box .inner h3 { font-size: 18px; margin-bottom:.1rem
}
.qy_box .inner .txt { line-height: 1.76 }
}
.contact_box .box_1 {
margin-bottom:.6rem;
font-size:.2rem; font-weight: bold; text-align: center; display: flex; align-items: stretch; flex-wrap: wrap }
.contact_box .box_1 .ic1 { background: url('../images/ic_dz1.png') no-repeat center center }
.contact_box .box_1 .ic2 { background: url('../images/ic_dz2.png') no-repeat center center }
.contact_box .box_1 .ic3 { background: url('../images/ic_dz3.png') no-repeat center center }
.contact_box .box_1 .ic4 { background: url('../images/ic_dz4.png') no-repeat center center }
.contact_box .box_1::before { display: none }
.contact_box .box_1 li {
padding-top:.34rem;
padding-bottom:.34rem; border-left: 1px solid #f6f6f6 }
.contact_box .box_1 li:first-child { border-left: none }
@media (max-width:768px) {
.contact_box .box_1 li:nth-child(3) { border-left: none }
.contact_box .box_1 li:nth-child(1), .contact_box .box_1 li:nth-child(2) { border-bottom: 1px solid #f2f2f3 }
}
@media (max-width:480px) {
.contact_box .box_1 li { font-size: 14px }
.contact_box .box_1 li br { display: none }
}
.contact_box .box_1 .ic {
width:.8rem;
height:.8rem; display: block; background-color: #E62129; border-radius: 50%; background-size:.3rem;
margin:0 auto .2rem
}
.contact_box .box_1 a:hover { color: #E62129 }
.contact_box .map { height: 6rem; background-color: #E62129 }
.contact_box .box_3 { background: #f6f6f6; padding:.9rem 0 .7rem;
text-align: center }
.contact_box .box_3 .row { display: flex; align-items: stretch; flex-wrap: wrap; font-size: 16px; margin-left: -0.21rem !important; margin-right: -0.21rem !important }
.contact_box .box_3 .row>* { padding-left:.21rem !important;
padding-right:.21rem !important;
margin-bottom:.42rem
}
@media (max-width:992px) {
.contact_box .box_3 .row { margin-left: -0.15rem !important; margin-right: -0.15rem !important }
.contact_box .box_3 .row>* { padding-left:.15rem !important;
padding-right:.15rem !important;
margin-bottom:.3rem
}
}
@media (max-width:480px) {
.contact_box .box_3 .row li { width: 100% }
.contact_box .box_3 .row li img { width: 2.2rem; height: 2.2rem }
}
.contact_box .box_3 .row .inner { background: #fff; height: 100%; padding:.7rem .4rem .8rem
}
.contact_box .box_3 .row img { width: 1.4rem; height: 1.4rem; display: block; margin:0 auto .2rem
}
.contact_box .box_3 .row .txt { color: #666 }
.contact_box .box_3 .row .txt span { color: #E62129 }
.honor_main { background: url('../images/honor_bg.png') no-repeat center top; background-color: #f6f6f6; padding:.9rem 0;
position: relative; margin-top: -0.8rem }
@media (max-width:639px) {
.honor_main .vhd h2 { text-align: center; margin-bottom:.5rem
}
}
@media (min-width:640px) {
.honor_main .vhd { display: -webkit-flex; display: flex; display: -webkit-box; display: box; -webkit-align-items: center; align-items: center; -webkit-box-align: center; box-align: center; -webkit-box-pack: justify; box-pack: justify; -webkit-justify-content: space-between; justify-content: space-between }
}
.honor_main .vhd nav { display: -webkit-flex; display: flex; display: -webkit-box; display: box; -webkit-align-items: center; align-items: center; -webkit-box-align: center; box-align: center }
@media (max-width:639px) {
.honor_main .vhd nav { display: -webkit-flex; display: flex; display: -webkit-box; display: box; -webkit-align-items: center; align-items: center; -webkit-box-align: center; box-align: center; -webkit-box-pack: center; box-pack: center; -webkit-justify-content: center; justify-content: center; margin-top:.3rem
}
}
.honor_main .vhd nav a { display: block; line-height: 40px; border: 1px solid #ccc; background: #fff; padding: 0 20px; margin-left: 10px; font-size: 16px; color: #666 }
@media (max-width:480px) {
.honor_main .vhd nav a { line-height: 36px; font-size: 15px; padding: 0 12px }
.honor_main .vhd nav a a { margin: 0 5px }
}
.honor_main .vhd nav a.active, .honor_main .vhd nav a:hover { background-color: #E62129; color: #fff; border-color: #E62129 }
.honor_main .row { margin-left: -0.18rem !important; margin-right: -0.18rem !important; display: flex; flex-wrap: wrap; align-items: stretch }
.honor_main .row>* { padding-left:.18rem !important;
padding-right:.18rem !important;
margin-bottom:.36rem
}
.honor_main .row::before { display: none }
@media (max-width:480px) {
.honor_main .row { margin-left: -0.1rem !important; margin-right: -0.1rem !important }
.honor_main .row>* { padding-left:.1rem !important;
padding-right:.1rem !important;
margin-bottom:.2rem
}
}
.honor_main .inner { background: #fff; padding:.3rem .3rem .4rem;
text-align: center; height: 100%; transition: .6s }
.honor_main .inner:hover { box-shadow: 0 0 15px rgba(0,0,0,0.3) }
.honor_main .inner .img { margin-bottom:.2rem
}
.honor_main .inner .tit { font-size: 16px; color: #666 }
@media (max-width:640px) {
.honor_main .inner .tit { font-size: 14px }
}
.video_main {
padding:.8rem 0 1.2rem; position: relative; margin-top: -0.8rem }
.video_main .row { margin-left: -0.23rem !important; margin-right: -0.23rem !important; display: flex; flex-wrap: wrap; align-items: stretch }
.video_main .row>* { padding-left:.23rem !important;
padding-right:.23rem !important;
margin-bottom:.46rem
}
.video_main .row::before { display: none }
@media (max-width:768px) {
.video_main .row { margin-left: -0.13rem !important; margin-right: -0.13rem !important }
.video_main .row>* { padding-left:.13rem !important;
padding-right:.13rem !important;
margin-bottom:.26rem
}
}
.video_main .inner { background: #fff; height: 100%; transition: .6s; position: relative }
.video_main .inner::after { content: ''; display: block; position: absolute; width: 0; height: 1px; background-color: #E62129; left: 0; bottom: 0; transition: .6s }
.video_main .inner:hover::after { width: 100% }
.video_main .inner .icon-play { position: absolute; left: 50%; top: 50%; transform: translateX(-50%) translateY(-50%); z-index: 5; color: #fff; font-size:.5rem
}
.video_main .inner .tit { font-size: 18px; line-height: 1.76; padding:.2rem
}
@media (max-width:1200px) {
.video_main .inner .tit { font-size: 16px }
}
@media (max-width:768px) {
.video_main .inner .tit { font-size: 15px }
}
.news_info { font-size: 16px; line-height: 1.78; padding-bottom:.7rem
}
.news_info p { margin-bottom: 1.5em }
.news_info img { display: block; margin-left: auto; margin-right: auto }
.news_pnext { padding-top: 30px; font-size: 16px; line-height: 2; border-top: 1px solid #f2f2f3 }
.news_pnext p { overflow: hidden; white-space: nowrap; -o-text-overflow: ellipsis; text-overflow: ellipsis }
.news_pnext p a { color: #E62129 }
@media (min-width:768px) {
.news_pnext { display: -webkit-flex; display: flex; display: -webkit-box; display: box; -webkit-align-items: center; align-items: center; -webkit-box-align: center; box-align: center; -webkit-box-pack: justify; box-pack: justify; -webkit-justify-content: space-between; justify-content: space-between }
.news_pnext p { width: 42% }
.news_pnext .next { text-align: right }
}
@media (max-width:767px) {
.news_pnext { margin-bottom:.2rem
}
}
.news_pnext .return { background-color: #E62129; color: #fff; width: 110px; height: 30px; line-height: 30px; text-align: center; display: inline-block; transition: .6s; font-size: 14px; margin:0 .4rem
}
.news_pnext .return em { padding-right: 18px; background: url('../images/arr_f.png') no-repeat right center; display: inline-block }
.news_pnext .return:hover { background-color: #000 }
.case_info_main { padding:.8rem 0 1rem
}
.case_info_main h2 {
font-size:.36rem; text-align: center; position: relative; padding-bottom:.2rem;
margin-bottom:.5rem
}
@media (max-width:640px) {
.case_info_main h2 { font-size: 24px; line-height: 1.5 }
}
.case_info_main h2::after { content: ''; display: block; width: 50px; height: 4px; background-color: #E62129; position: absolute; left: 50%; transform: translateX(-50%); z-index: 5; bottom: 0 }
.news_info_main {
padding:.8rem 0 1.2rem; position: relative; margin-top: -0.8rem }
@media (min-width:640px) {
.news_info_main { background: #f6f6f6 }
.news_info_main .wrap { background: #fff; padding:.8rem 7%
}
}
.news_info_main .news_hd { border-bottom: 1px solid #f2f2f3; margin-bottom:.5rem;
padding-bottom:.3rem;
text-align: center }
.news_info_main .news_hd h2 {
font-size:.3rem; position: relative; padding-bottom:.2rem
}
@media (max-width:640px) {
.news_info_main .news_hd h2 { font-size: 23px; line-height: 1.5 }
}
.news_info_main .news_hd .time { color: #999; font-size: 16px }
.ys_box {
padding:.66rem 0 .9rem; background: url('../images/ys_bg.jpg') no-repeat center center; background-size: cover }
.ys_box .vhd { text-align: center }
.ys_box .row { margin-left: -0.2rem !important; margin-right: -0.2rem !important; display: flex; align-items: stretch; flex-wrap: wrap }
.ys_box .row>* { padding-left:.2rem !important;
padding-right:.2rem !important;
margin-bottom:.4rem
}
.ys_box .row::before { display: none }
@media (max-width:1360px) {
.ys_box .row { margin-left: -0.15rem !important; margin-right: -0.15rem !important }
.ys_box .row>* { padding-left:.15rem !important;
padding-right:.15rem !important;
margin-bottom:.3rem
}
}
@media (max-width:1200px) {
.ys_box .row { margin-left: -0.1rem !important; margin-right: -0.1rem !important }
.ys_box .row>* { padding-left:.1rem !important;
padding-right:.1rem !important;
margin-bottom:.2rem
}
}
.ys_box .inner { background: #fff; text-align: center; padding:.6rem 6%;
height: 100%; transition: .6s }
@media (min-width:1200px) {
.ys_box .inner:hover .ic { transform: rotate(360deg) }
}
.ys_box .inner .ic1 { background: url('../images/qy_1.png') no-repeat center center }
.ys_box .inner .ic2 { background: url('../images/qy_2.png') no-repeat center center }
.ys_box .inner .ic3 { background: url('../images/qy_3.png') no-repeat center center }
.ys_box .inner .ic4 { background: url('../images/qy_4.png') no-repeat center center }
.ys_box .inner .ic { width: 1rem; height: 1rem; display: block; background-size: contain; transition: .6s; margin: 0 auto }
.ys_box .inner h3 { font-size:.3rem;
margin:.24rem 0 .1rem
}
.ys_box .inner .txt {
font-size:.18rem; line-height: 1.76; color: #666 }
@media (max-width:1280px) {
.ys_box .inner h3 { font-size: 20px }
.ys_box .inner .txt { font-size: 14px }
}
@media (max-width:480px) {
.ys_box .inner h3 { font-size: 18px; margin-bottom:.1rem
}
.ys_box .inner .txt { line-height: 1.76 }
}
.hz_lc_box { background: url('../images/hz_bg.png') no-repeat center top; padding: 1rem 0; text-align: center }
.hz_lc_box .vhd { margin-bottom:.76rem
}
.hz_lc_box li { margin-bottom:.5rem
}
.hz_lc_box .ic1 { background: url('../images/hz_1.png') no-repeat center center }
.hz_lc_box .ic2 { background: url('../images/hz_2.png') no-repeat center center }
.hz_lc_box .ic3 { background: url('../images/hz_3.png') no-repeat center center }
.hz_lc_box .ic4 { background: url('../images/hz_4.png') no-repeat center center }
.hz_lc_box .ic5 { background: url('../images/hz_5.png') no-repeat center center }
.hz_lc_box .ic6 { background: url('../images/hz_6.png') no-repeat center center }
.hz_lc_box .ic { width: 1rem; height: 1rem; display: block; background-size: contain; transition: .6s; margin: 0 auto }
.hz_lc_box h3 { font-size: 18px; margin:.24rem 0 0
}
@media (max-width:640px) {
.hz_lc_box h3 { font-size: 16px }
}
.hz_form {
padding:.8rem 0 1.2rem; background: url('../images/hz_form_bg.jpg') no-repeat center center; background-size: cover }
.hz_form .vhd { text-align: center }
.hz_form form {
padding-top:.1rem; max-width: 1000px; display: block; margin: 0 auto }
.hz_form form .row { margin-left: -0.1rem !important; margin-right: -0.1rem !important }
.hz_form form .row>* { padding-left:.1rem !important;
padding-right:.1rem !important;
margin-bottom:.2rem
}
.hz_form form .layui-input, .hz_form form .layui-textarea { height: 48px; resize: none }
.hz_form form .layui-input:focus, .hz_form form .layui-textarea:focus { border-color: #E62129 !important }
.hz_form .submitbox { padding-top:.4rem
}
.hz_form .submit { width: 240px; height: 48px; line-height: 48px; text-align: center; background-color: #E62129; font-size: 18px; cursor: pointer; margin: 0 auto; color: #fff }
@media (max-width:640px) {
.hz_form .submit { font-size: 16px; width: 200px; height: 42px; line-height: 42px; text-align: center }
}
.hz_form .submit:hover { background-color: #000 }
.more_xs { width: 100px; height: 30px; line-height: 30px; text-align: center; border-color: #E62129; background-color: #E62129; display: inline-block; color: #fff }
.more_xs:hover { background: #000; color: #fff }
.more_xs em { display: inline-block; padding-right: 20px; background: url('../images/arr_f.png') no-repeat right center }
.case_main { padding:.8rem 0
}
.case_list { margin-bottom:.5rem
}
@media (min-width:640px) {
.case_list li { display: -webkit-flex; display: flex; display: -webkit-box; display: box; -webkit-align-items: center; align-items: center; -webkit-box-align: center; box-align: center; -webkit-box-pack: justify; box-pack: justify; -webkit-justify-content: space-between; justify-content: space-between; align-items: stretch }
.case_list .info { min-width: 0; -webkit-box-flex: 1; -webkit-flex-grow: 1; -ms-flex-positive: 1; flex-grow: 1; -webkit-flex-shrink: 1; -ms-flex-negative: 1; flex-shrink: 1; padding:.4rem .5rem
}
.case_list .img { max-width: 4.24rem; width: 40%; height: 100% }
}
@media (min-width:640px) and (max-width:640px) {
.case_list .info { padding:.3rem
}
}
@media (min-width:640px) and (min-width:1200px) {
.case_list .img { width: 4.24rem; height: 3rem }
}
.case_list li {
margin-bottom:.4rem; background: #f6f6f6 }
@media (min-width:993px) {
.case_list li { position: relative }
.case_list li:hover .title { color: #E62129 }
}
.case_list .title { display: block; font-size: 24px; position: relative; line-height: 30px }
@media (max-width:992px) {
.case_list .title { font-size: 20px }
}
@media (min-width:640px) {
.case_list .title { overflow: hidden; white-space: nowrap; -o-text-overflow: ellipsis; text-overflow: ellipsis }
}
@media (max-width:639px) {
.case_list .info { padding:.4rem
}
}
.case_list .info .desc { font-size: 16px; line-height: 30px; height: 90px; word-break: break-all; display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; -webkit-line-clamp: 3; color: #666; margin:10px 0 .3rem
}
@media (max-width:992px) {
.case_list .info .desc { -webkit-line-clamp: 2; height: 52px; line-height: 26px; font-size: 15px }
}
@media (max-width:639px) {
.case_list .info .desc { -webkit-line-clamp: 3; height: 78px; margin-bottom:.4rem
}
}
.case_list .info .more_xs { position: relative; display: block; margin: 0 0 0 auto }
@media (max-width:639px) {
.case_list li { margin-bottom:.4rem
}
}
.news_main { padding:.8rem 0
}
.news_list { margin-bottom:.5rem
}
@media (min-width:640px) {
.news_list li { display: flex }
.news_list .info { flex: 1; order: -1; padding:0 .5rem 0 0
}
.news_list .img { max-width: 4.4rem; width: 45% }
}
.news_list li {
padding:.36rem 0; border-bottom: 1px solid #f2f2f3; position: relative }
.news_list li::after { content: ''; display: block; position: absolute; width: 0; height: 1px; background-color: #E62129; left: 0; bottom: 0; transition: .6s }
@media (min-width:993px) {
.news_list li { position: relative }
.news_list li:hover .title { color: #E62129 }
.news_list li:hover::after { width: 100% }
}
.news_list .title { display: block; font-size: 24px; position: relative; line-height: 30px }
@media (max-width:992px) {
.news_list .title { font-size: 20px }
}
@media (min-width:640px) {
.news_list .title { overflow: hidden; white-space: nowrap; -o-text-overflow: ellipsis; text-overflow: ellipsis }
}
@media (min-width:768px) {
.news_list .info { padding:.4rem .5rem .4rem 0
}
}
@media (max-width:480px) {
.news_list .info { padding:.4rem 0 0
}
}
.news_list .info .time { font-size: 16px; margin-bottom:.2rem;
color: #999; font-family: medium }
.news_list .info .time .day { color: #E62129; padding-right: 3px }
@media (max-width:480px) {
.news_list .info .time { margin-bottom:.3rem
}
}
.news_list .info .desc { font-size: 16px; line-height: 30px; height: 90px; word-break: break-all; display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; -webkit-line-clamp: 3; color: #666; margin:10px 0 .3rem
}
@media (max-width:992px) {
.news_list .info .desc { -webkit-line-clamp: 2; height: 52px; line-height: 26px; font-size: 15px }
}
@media (max-width:639px) {
.news_list .info .desc { -webkit-line-clamp: 3; height: 84px; margin-bottom:.4rem
}
}
@media (max-width:639px) {
.news_list li { margin-bottom:.4rem
}
}
.news_rec { background: url('../images/xsrec_bg.jpg') no-repeat center center; background-size: cover; padding:.8rem 0;
position: relative; margin-top: -0.8rem }
@media (max-width:640px) {
.swiper_news_rec { padding-bottom: 1rem }
}
.swiper_news_rec .pnext { width: 130px; margin: 26px 0 0 auto; height: 60px; position: relative }
.swiper_news_rec .pnext>div::after { display: none }
.swiper_news_rec .pnext>div { border: 1px solid #bbbbbb; width: 48px; height: 48px; line-height: 48px; text-align: center; transition: .6s }
.swiper_news_rec .pnext>div.swiper-button-next, .swiper_news_rec .pnext>div:hover { border-color: #E62129; background-color: #E62129 }
.swiper_news_rec .pnext>div.swiper-button-next .iconfont, .swiper_news_rec .pnext>div:hover .iconfont { color: #fff }
.swiper_news_rec .pnext .iconfont { font-size: 20px; color: #666 }
@media (max-width:480px) {
.swiper_news_rec .pnext { height: 40; width: 110px }
.swiper_news_rec .pnext>div { width: 40px; height: 40px; line-height: 40px; text-align: center }
}
.swiper_news_rec li { background: #fff }
@media (min-width:640px) {
.swiper_news_rec li .iwrap { display: flex; align-items: stretch }
.swiper_news_rec li .iwrap .img, .swiper_news_rec li .iwrap .info { width: 50%; flex: 1 }
.swiper_news_rec li .iwrap:hover .title { color: #E62129 }
}
.swiper_news_rec .img { display: block }
.swiper_news_rec .info { display: flex; align-items: center }
.swiper_news_rec .info .inner {
padding:.3rem .5rem; width: 100% }
@media (max-width:768px) {
.swiper_news_rec .info .inner { padding:.5rem .4rem
}
}
@media (max-width:640px) {
.swiper_news_rec .info .inner { padding:.5rem .3rem
}
}
.swiper_news_rec .title { display: block; font-size: 24px; position: relative; line-height: 30px }
@media (max-width:992px) {
.swiper_news_rec .title { font-size: 20px }
}
@media (min-width:640px) {
.swiper_news_rec .title { overflow: hidden; white-space: nowrap; -o-text-overflow: ellipsis; text-overflow: ellipsis }
}
.swiper_news_rec .time { font-size: 16px; margin-bottom:.2rem;
color: #999; font-family: medium }
.swiper_news_rec .time .day { color: #E62129; padding-right: 3px }
@media (max-width:639px) {
.swiper_news_rec .time { display: none }
}
.swiper_news_rec .desc { font-size: 16px; line-height: 30px; height: 90px; word-break: break-all; display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; -webkit-line-clamp: 3; color: #666; margin:10px 0 .3rem
}
@media (max-width:992px) {
.swiper_news_rec .desc { line-height: 26px; font-size: 15px; height: 78px }
}
@media (max-width:639px) {
.swiper_news_rec .desc { display: none }
}
.swiper_news_rec .more { color: #E62129; padding-left: 56px; position: relative; font-size: 16px }
@media (max-width:992px) {
.swiper_news_rec .more { display: none }
}
.swiper_news_rec .more::before { content: ''; display: block; width: 40px; height: 40px; background: url('../images/arr_f.png') no-repeat center center; background-color: #E62129; border-radius: 50%; position: absolute; top: 50%; transform: translateY(-50%); z-index: 5; left: 0 }
.swiper_news_rec .more:hover { color: #000 }
.swiper_news_rec .more:hover::before { background-color: #000 }
.network_box { background: #fff url(../images/dot.png) repeat; padding: 1rem 0; position: relative; margin-top: -0.8rem }
@media (max-width:640px) {
.network_box { padding:.6rem 0 1.2rem
}
}
.network_box .wrap { position: relative }
.network_box .inner { max-width: 1555px; margin-left: auto; margin-right: auto; position: relative }
.network_box .imgbox { position: relative }
.network_box .fp { position: absolute; left: 50%; transform: translateX(-50%); z-index: 5 }
.network_box .fp .icon { width:.25rem
}
.network_box .fp h5 { position: absolute; left: 50%; transform: translateX(-50%); z-index: 5; white-space: nowrap; bottom: -20px; font-weight: bold; color: #000 }
.network_box .first .fp { top: 36.5%; z-index: 55; margin-left: 30.5% }
.network_box .second .fp { top: 48.5%; z-index: 55; margin-left: 15.5% }
.network_box .hzzb { position: absolute; top: 50%; left: 100%; margin-left: -270px; width: 3.98rem; height: 3.09rem; transform: translateY(-65%); padding:.4rem .5rem;
background-color: #fff; box-shadow: 0 3px 8px #E5E5E5 }
@media (max-width:1680px) {
.network_box .hzzb { margin-left: -250px; padding:.4rem .3rem;
width: 320px }
}
.network_box .hzzb .d_text { color: #333; font-weight: bold; margin-bottom: 14px; letter-spacing: 6px; font-size: 24px }
.network_box .hzzb .c_text { display: block; color: #666; line-height: 2; font-size: 16px }
.network_box .hzzb a.c_text:hover { color: #E62129 }
@media (max-width:1679px) {
.network_box .hzzb { margin: 0; width: 470px; height: auto; top: 21%; left: auto; right: 5% }
}
@media (max-width:991px) {
.network_box .hzzb .d_text { font-size: 20px; margin-bottom: 7px }
.network_box .hzzb .c_text { line-height: 1.7 }
}
@media (max-width:768px) {
.network_box .hzzb { right: 30%; width: auto; left: 10%; top: 50% }
}
@media (max-width:480px) {
.network_box .hzzb { position: static; margin-top: 2rem; padding:.5rem
}
.network_box .hzzb .d_text { font-size: 20px }
.network_box .hzzb .c_text { font-size: 15px }
}
.network_box .quanguo { width: 326px; height: 50px; position: absolute; bottom: 80px; left: 0%; bottom: 0; display: flex; border-radius: 30px; overflow: hidden }
@media (max-width:992px) {
.network_box .quanguo { left: 50%; transform: translateX(-50%) }
}
.network_box .quanguo .zq { width: 50%; height: 100%; display: flex; align-items: center; justify-content: center; background-color: #f6f6f6; color: #333; cursor: pointer }
.network_box .quanguo .zq:hover { color: #fff; background-color: #E62129 }
.network_box .quanguo .zq.active { color: #fff; background-color: #E62129 }
.answar_main { padding: 1rem 0; position: relative; margin-top: -0.8rem }
.answar_main .answar_item {
margin-bottom:.2rem; background: #fff; border: 1px solid #e5e5e5; padding:0 .4rem
}
.answar_main .answar_item.open { background-color: #E62129; border-color: #E62129; color: #fff }
.answar_main .answar_item.open .hd .iconfont:before { content: "\e68b" }
@media (min-width:640px) {
.answar_main .answar_item.open .tit { background-image: url('../images/ic_qa2.png') }
.answar_main .answar_item.open .show { color: #fff; background-image: url('../images/arr_f.png') }
}
.answar_main .hd { display: flex; font-size: 20px; cursor: pointer; padding: 20px 0 }
.answar_main .hd .tit { min-width: 0; -webkit-box-flex: 1; -webkit-flex-grow: 1; -ms-flex-positive: 1; flex-grow: 1; -webkit-flex-shrink: 1; -ms-flex-negative: 1; flex-shrink: 1; font-size: 20px; margin-right:.5rem
}
@media (min-width:640px) {
.answar_main .hd .tit {
padding-left:.45rem; background: url('../images/ic_qa.png') no-repeat left center; background-size:.3rem
}
}
@media (max-width:480px) {
.answar_main .hd .tit { margin-right:.2rem
}
}
.answar_main .hd .show { color: #E62129; font-size: 16px; padding-right:.28rem;
background: url('../images/arr_c.png') no-repeat right center }
@media (max-width:480px) {
.answar_main .hd .show { background-size:.2rem
}
}
.answar_main .bd { display: none; padding:.26rem 0 .5rem;
font-size: 16px; line-height: 1.76; color: #fff; border-top: 1px solid #fff }
@media (max-width:768px) {
.answar_main .hd .tit { font-size: 17px }
.answar_main .hd .show { font-size: 14px }
.answar_main .bd { font-size: 14px }
}
.recuit_box { padding-bottom: 1rem }
.recuit_box .vhd { text-align: center }
.recuit_box .list { margin-bottom:.57rem
}
.recuit_box .recruit_item { margin-bottom:.4rem
}
.recuit_box .recruit_item.open { background-color: #E62129; border-color: #E62129; color: #fff }
.recuit_box .recruit_item.open .hd .icon-down:before { content: "\e68b" }
.recuit_box .recruit_item.open .hd .show { color: #fff; background-image: url('../images/arr_f.png') }
.recuit_box .recruit_item.open .data, .recuit_box .recruit_item.open .bd { color: #fff }
@media (min-width:640px) {
.recuit_box .recruit_item.open .show { color: #fff; background-image: url('../images/arr_f.png') }
}
.recuit_box .hd { border: 1px solid #f2f2f3; padding:0 .6rem
}
@media (max-width:480px) {
.recuit_box .hd { padding:0 .3rem
}
}
.recuit_box .hd .top { border-bottom: 1px solid #f2f2f3; cursor: pointer; padding: 20px 0; display: -webkit-flex; display: flex; display: -webkit-box; display: box; -webkit-align-items: center; align-items: center; -webkit-box-align: center; box-align: center; -webkit-box-pack: justify; box-pack: justify; -webkit-justify-content: space-between; justify-content: space-between }
.recuit_box .hd .top .tit { font-size: 24px; font-weight: bold; overflow: hidden; white-space: nowrap; -o-text-overflow: ellipsis; text-overflow: ellipsis; margin-right:.1rem
}
.recuit_box .hd .top .tit .iconfont { margin-right:.1rem
}
@media (max-width:992px) {
.recuit_box .hd .top .tit { font-size: 20px }
}
@media (max-width:768px) {
.recuit_box .hd .top .tit { font-size: 17px }
}
.recuit_box .hd .top .show { color: #E62129; font-size: 16px; padding-right:.28rem;
background: url('../images/arr_c.png') no-repeat right center }
@media (max-width:480px) {
.recuit_box .hd .top .show { background-size:.2rem
}
}
.recuit_box .hd .data { padding: 30px 0; color: #666; display: flex; justify-content: space-between; flex-wrap: wrap }
@media (max-width:640px) {
.recuit_box .hd .data { padding: 15px 0 }
.recuit_box .hd .data .txt { width: 50%; margin-bottom:.2rem
}
}
.recuit_box .bd { display: none; border: 1px solid #fff; border-top: 0; padding:.4rem .6rem .9rem;
font-size: 16px; line-height: 1.76; color: #fff }
@media (max-width:640px) {
.recuit_box .bd { font-size: 15px }
}
@media (max-width:480px) {
.recuit_box .bd { padding:.4rem .3rem .9rem
}
}
.recuit_box .bd p { min-height: 20px }
.col_body {
margin-top:.8rem; margin-bottom: 1.2rem; position: relative; min-height: 80vh }
@media (max-width:1200px) {
.col_body { width: 96vw }
}
@media (max-width:991px) {
.col_body { width: 92vw }
}
@media (max-width:480px) {
.col_body { margin-top:.5rem
}
}
@media (min-width:992px) {
.col_body .col_sub { float: left; width: 23%; max-width: 304px; min-width: 210px }
.col_body .col_main { float: left; }
}
@media (min-width:992px) and (max-width:1200px) {
.col_body .col_main { width: 75% }
}
@media (min-width:992px) and (max-width:1199px) {
.col_body .col_main { width: 73% }
}
@media (min-width:992px) and (max-width:991px) {
.col_body .col_main { width: 100% }
}
@media (min-width:992px) and (min-width:1200px) {
.col_body .col_main_2 { margin: 0 300px 0 350px; padding:0 .75rem;
width: 58%; float: none }
}
@media (min-width:992px) and (min-width:1200px) and (max-width:1920px) {
.col_body .col_main_2 { margin: 0 22% 0 21% }
}
@media (min-width:992px) and (min-width:1200px) and (max-width:1360px) {
.col_body .col_main_2 { width: 60% }
}
@media (min-width:992px) and (min-width:1200px) and (max-width:1280px) {
.col_body .col_main_2 {
padding:0 .5rem; width: auto }
}
@media (min-width:992px) and (min-width:1200px) and (max-width:1200px) {
.col_body .col_main_2 { margin-right: 0; padding-right: 0; margin-left: 22% }
}
@media (min-width:992px) {
.col_body.s2 .col_sub { float: right }
.col_body.s2 .col_main { width: 73%; padding-left: 0 }
}
.sub_menu .info { font-size: 16px }
.sub_menu .info a { display: block; height: 64px; line-height: 64px; position: relative; color: #000; border-bottom: 1px solid #f2f2f3; padding-right:.5rem
}
@media (min-width:1200px) {
.sub_menu .info a::after { content: ''; width: 12px; height: 12px; background: url('../images/arr_f.png') no-repeat right center; position: absolute; right: 20px; top: 50%; transform: translateY(-50%) }
}
.sub_menu .info a em { display: inline-block; vertical-align: middle; margin:0 .16rem;
position: relative; width:.36rem;
height: 100%; box-sizing: content-box; overflow: hidden }
.sub_menu .info a i { height: 100%; width: 100%; background-size: contain; background-repeat: no-repeat; background-position: center; display: block; position: absolute; top: 0; left:.36rem;
border-right: -0.36rem solid transparent; -webkit-filter: drop-shadow(-0.36rem 0 0 #E62129); filter: drop-shadow(-0.36rem 0 0 #E62129) }
.sub_menu .info a.active, .sub_menu .info a:hover { background-color: #E62129; color: #fff }
.sub_menu .info a.active i, .sub_menu .info a:hover i {
left:.36rem; -webkit-filter: drop-shadow(-0.36rem 0 0 #fff); filter: drop-shadow(-0.36rem 0 0 #fff) }
.sub_menu .info .active { background-color: #E62129; color: #fff }
.col_sub h2 { height: 65px; line-height: 65px; font-size: 20px; padding-left:.26rem;
background-color: #E62129; color: #fff }
@media (max-width:1360px) {
.col_sub h2 { height: 60px; line-height: 60px; font-size: 20px }
}
@media (max-width:640px) {
.col_sub h2 { height: 48px; line-height: 48px }
}
.col_sub>*+* { margin-top:.3rem
}
.list_good .hd { line-height: 1rem; background: url('../images/cptit_bg.png') no-repeat center right; margin-bottom:.4rem;
font-size:.3rem;
font-weight: bold; padding-left:.2rem
}
@media (max-width:640px) {
.list_good .hd { font-size: 20px }
}
.list_good .row { text-align: center; margin-left: -0.2rem !important; margin-right: -0.2rem !important; padding-bottom:.3rem;
display: flex; flex-wrap: wrap; align-items: stretch }
.list_good .row>* { padding-left:.2rem !important;
padding-right:.2rem !important;
margin-bottom:.4rem
}
.list_good .row::before { display: none }
.list_good .row li { margin-bottom:.4rem
}
@media (max-width:1679px) {
.list_good .row { margin-left: -0.15rem !important; margin-right: -0.15rem !important }
.list_good .row>* { padding-left:.15rem !important;
padding-right:.15rem !important;
margin-bottom:.3rem
}
.list_good .row li { margin-bottom:.3rem
}
}
@media (max-width:992px) {
.list_good .row { margin-left: -0.1rem !important; margin-right: -0.1rem !important }
.list_good .row>* { padding-left:.1rem !important;
padding-right:.1rem !important;
margin-bottom:.2rem
}
.list_good .row li { margin-bottom:.2rem
}
}
.good_item .inner { border: 1px solid #f2f2f3; padding:0 0 .26rem;
height: 100%; transition: .6s }
.good_item .inner .tit { font-size: 18px; display: block; line-height: 1.76; margin:15px .2rem 0
}
.good_item .inner:hover a.type { color: #E62129 }
.good_item .inner:hover .coverimg { transform: scale(1.1) }
.good_item .inner:hover .tit { color: #E62129 }
@media (max-width:1360px) {
.good_item .inner .type { font-size: 18px }
}
@media (max-width:768px) {
.good_item .inner .type { font-size: 16px }
.good_item .inner .tit { font-size: 14px }
}
.download_list { border-top: 1px solid #f2f2f3 }
.download_list li { border-bottom: 1px solid #f2f2f3 }
.download_list li a {
padding:20px .2rem 20px 70px; display: block; position: relative }
@media (min-width:481px) {
.download_list li a { padding-right: 1rem }
}
.download_list li a::before { content: ''; display: block; position: absolute; background: url('../images/ic_pdf.png') no-repeat center left; width:.5rem;
height: 100%; left: 20px; top: 0 }
@media (max-width:480px) {
.download_list li a { padding-left: 40px }
.download_list li a::before { left: 0; height: 32px; top: 20px; background-size: contain }
}
.download_list li a .tit { font-size: 18px; color: #000 }
@media (max-width:480px) {
.download_list li a .tit { font-size: 17px }
}
.download_list li a .time { margin-top: 10px; color: #999 }
.download_list li a .download { position: absolute; right:.26rem;
top: 50%; transform: translateY(-50%); font-size: 16px; color: #666 }
@media (min-width:992px) {
.download_list li a:hover { box-shadow: 0 0 10px rgba(0,0,0,0.2); box-shadow: 0 0 10px rgba(0,0,0,0.1); position: relative; z-index: 55 }
.download_list li a:hover .tit, .download_list li a:hover .download { color: #E62129 }
}
.hd2 { text-align: center; font-size:.36rem;
position: relative; padding-bottom:.2rem;
margin-bottom:.72rem
}
.hd2::after { content: ""; width:.5rem;
height:.04rem;
background-color: #E62129; position: absolute; left: 50%; transform: translateX(-50%); z-index: 5; bottom: 0 }
.hd3 {
font-size:.3rem;
padding-left:.42rem; position: relative; margin-bottom:.3rem
}
.hd3::before { content: ''; width:.14rem;
height:.3rem;
background-color: #E62129; border-right:.06rem solid #d6d6d6;
position: absolute; left: 0; top: 50%; transform: skew(-10deg) translateY(-50%) }
@media (max-width:768px) {
.hd3 { font-size: 20px; padding-left:.34rem
}
.hd3::before { height:.36rem
}
}
.solution_intro { padding:1rem 0 .8rem
}
@media (min-width:992px) {
.solution_intro .content { display: flex; align-items: stretch }
.solution_intro .lbox { width: 50%; max-width: 680px; order: -1 }
.solution_intro .lbox .coverbox { height: 100% }
.solution_intro .rbox { flex: 1; display: flex; align-items: center }
}
@media (min-width:481px) {
.solution_intro .content { background: #f6f6f6 }
}
.solution_intro .rbox { padding:.3rem 5%
}
@media (max-width:1360px) {
.solution_intro .rbox { padding:.3rem 3%
}
}
@media (max-width:480px) {
.solution_intro .rbox { padding:0 0 .5rem
}
}
.solution_intro .rbox h2 { font-size:.36rem
}
@media (max-width:768px) {
.solution_intro .rbox h2 { font-size: 22px }
}
.solution_intro .rbox .txt { font-size: 16px; color: #666; line-height: 1.76 }
.solution_intro .rbox .txt p { margin-top:.2rem
}
.framework_box { margin-bottom: 1rem }
.framework_box .bd {
padding:.3rem; box-shadow: 0 0 10px rgba(0,0,0,0.2); box-shadow: 0 0 10px rgba(0,0,0,0.1); text-align: center }
.about_goods { background: #f6f6f6; padding:.8rem 0 .9rem
}
.about_goods .hd { display: -webkit-flex; display: flex; display: -webkit-box; display: box; -webkit-align-items: center; align-items: center; -webkit-box-align: center; box-align: center; -webkit-box-pack: justify; box-pack: justify; -webkit-justify-content: space-between; justify-content: space-between; margin-bottom:.36rem
}
.about_goods .hd .hd3 { margin-bottom: 0 }
.about_goods .pnext { width: 130px; margin-right: -10px; height: 51px; position: relative }
.about_goods .pnext>div::after { display: none }
.about_goods .pnext>div { border: 1px solid #bbb; width: 48px; height: 48px; line-height: 48px; text-align: center; transition: .6s }
.about_goods .pnext>div.swiper-button-next, .about_goods .pnext>div:hover { border-color: #E62129; background-color: #E62129 }
.about_goods .pnext>div.swiper-button-next .iconfont, .about_goods .pnext>div:hover .iconfont { color: #fff }
.about_goods .pnext .iconfont { font-size: 20px; color: #666 }
@media (max-width:480px) {
.about_goods .pnext { height: 40; width: 110px }
.about_goods .pnext>div { width: 40px; height: 40px; line-height: 40px; text-align: center }
}
.about_goods .good_swiper {
padding-bottom:.8rem; margin-left: -5px; margin-right: -5px }
.about_goods li { width: 25%; text-align: center }
.about_goods li .inner { margin: 0 5px; background: #fff; border: 1px solid #f2f2f3 }
@media (max-width:768px) {
.about_goods li { width: 33.33% }
}
@media (max-width:480px) {
.about_goods li { width: 50% }
}
.cpshow_trait { margin-bottom:.5rem
}
@media (max-width:380px) {
.cpshow_trait { padding-top:.8rem
}
}
.cpshow_trait .info { font-size: 16px }
.cpshow_trait .info p {
padding-left:.3rem;
margin-bottom:.1rem; line-height: 30px; position: relative }
.cpshow_trait .info p::before { content: ''; display: block; position: absolute; width: 6px; height: 6px; background-color: #E62129; border-radius: 50%; left: 0; top: 12px }
.cpshow_box { font-size: 16px; padding:.5rem 0
}
.cpshow_table .bd { overflow-x: auto }
.cpshow_table .bd .inner { max-width: 1200px }
@media (max-width:639px) {
.cpshow_table .bd { width: 100vw; position: relative; left: -4vw }
.cpshow_table .bd .inner { width: 640px!important; padding: 0 4vw }
}
.cpshow_table table { width: 100% }
.cpshow_table td { padding: 16px 20px; border: 1px solid #ddd; color: #666 }
@media (max-width:640px) {
.cpshow_table td { font-size: 15px; padding: 12px }
}
@media (max-width:480px) {
}
.cpshow_data { margin-bottom: 1rem }
.solution_swiper .good_item .inner { padding-bottom: 15px }
.cp_topper { background: url('../images/cp_bg.jpg') no-repeat center center; background-size: cover; padding:.6rem 0;
color: #fff }
@media (min-width:768px) {
.cp_topper .wrap { display: -webkit-flex; display: flex; display: -webkit-box; display: box; -webkit-align-items: center; align-items: center; -webkit-box-align: center; box-align: center; -webkit-box-pack: justify; box-pack: justify; -webkit-justify-content: space-between; justify-content: space-between }
.cp_topper .lbox { width: 55%; max-width: 630px }
.cp_topper .rbox { width: 40% }
}
.cp_topper .lbox { padding:.3rem 0
}
.cp_topper .lbox .type {
font-size:.48rem; text-transform: uppercase; font-weight: bold }
@media (max-width:640px) {
.cp_topper .lbox .type { font-size: 26px }
}
.cp_topper .lbox .tit {
font-size:.3rem;
padding-bottom:.3rem;
margin-bottom:.3rem; font-weight: bold; border-bottom: 1px solid rgba(255,255,255,0.4); position: relative }
.cp_topper .lbox .tit::after { content: ''; display: block; position: absolute; width: 30px; height: 2px; background-color: #E62129; left: 0; bottom: -1px }
@media (max-width:640px) {
.cp_topper .lbox .tit { font-size: 22px }
}
.cp_topper .lbox .desc { font-size: 16px; line-height: 1.76; margin-bottom:.6rem
}
.cp_topper .lbox .desc p { margin-top:.2rem
}
@media (max-width:768px) {
.cp_topper .lbox .desc { font-size: 15px }
}
.cp_topper .lbox .btns { font-size: 16px }
.cp_topper .lbox .btns a { width: 185px; height: 48px; line-height: 48px; text-align: center; text-align: left; display: inline-block; color: #fff; background-color: #E62129; padding-left:.2rem;
position: relative }
.cp_topper .lbox .btns a::after { content: ''; display: block; width: 12px; height: 12px; background: url('../images/arr_f.png') no-repeat center center; position: absolute; right: 20px; top: 50%; transform: translateY(-50%) }
.cp_topper .lbox .btns a:hover { background-color: #000 }
@media (max-width:992px) {
.cp_topper .lbox .btns a { width: 160px }
}
.cp_topper .lbox .btns a+a { margin-left:.2rem
}
.cp_topper .lbox .btns .quote { background-color: #ea8309 }
@media (max-width:480px) {
.cp_topper .lbox .btns { display: -webkit-flex; display: flex; display: -webkit-box; display: box; -webkit-align-items: center; align-items: center; -webkit-box-align: center; box-align: center; -webkit-box-pack: justify; box-pack: justify; -webkit-justify-content: space-between; justify-content: space-between }
}
@media (max-width:767px) {
.cp_topper .rbox { max-width: 400px; margin: 0 auto }
}
@keyframes warn { 0% {
transform:translate(-50%, -50%) scale(0);
-webkit-transform:translate(-50%, -50%) scale(0);
opacity:1
}
100% {
transform:translate(-50%, -50%) scale(1);
-webkit-transform:translate(-50%, -50%) scale(1);
opacity:0
}
}
@-webkit-keyframes warn1 { 0% {
transform:translate(-50%, -50%) scale(0);
-webkit-transform:translate(-50%, -50%) scale(0);
opacity:1
}
100% {
transform:translate(-50%, -50%) scale(1);
-webkit-transform:translate(-50%, -50%) scale(1);
opacity:0
}
}
.map_icon .ks { width: 10px; height: 10px; background-color: #d41517; position: absolute; top: 72%; left: 50%; transform: rotateX(258deg) translate(-50%, -50%) }
.map_icon .ks1 { content: ""; display: block; width: 30px; height: 30px; position: absolute; top: 50%; left: 50%; background-color: #ccc; -webkit-animation: warn 2s ease-out; -moz-animation: warn 2s ease-out; animation: warn 2s ease-out; -webkit-animation-iteration-count: infinite; -moz-animation-iteration-count: infinite; animation-iteration-count: infinite; border-radius: 50% }
.map_icon .ks2 { content: ""; display: block; width: 70px; height: 70px; position: absolute; top: 50%; left: 50%; background-color: #ccc; -webkit-animation: warn 2s ease-out; -moz-animation: warn 2s ease-out; animation: warn 2s ease-out; -webkit-animation-iteration-count: infinite; -moz-animation-iteration-count: infinite; animation-iteration-count: infinite; border-radius: 50% }
.map_icon .ks3 { content: ""; display: block; width: 120px; height: 120px; position: absolute; top: 50%; left: 50%; background-color: #ccc; -webkit-animation: warn 2s ease-out; -moz-animation: warn 2s ease-out; animation: warn 2s ease-out; -webkit-animation-iteration-count: infinite; -moz-animation-iteration-count: infinite; animation-iteration-count: infinite; border-radius: 50% }
.play_btn {
width:.8rem;
height:.8rem; position: absolute; left: 50%; top: 50%; z-index: 5; transform: translateX(-50%) translateY(-50%) }
@media (min-width:1280px) {
}
.play_btn .icon {
width:.8rem;
height:.8rem; border-radius: 50%; background: url('../images/play.png') no-repeat center center; background-color: #fff; background-size:.46rem;
box-sizing: content-box }
.play_btn .line { border-radius: 50%; border: 1px solid #fff; position: absolute; left: 50%; top: 50%; width:.8rem;
height:.8rem;
box-sizing: content-box; transform: translateX(-50%) translateY(-50%); cursor: pointer }
.play_btn .l1 { animation: scale3 2s infinite linear }
.play_btn .l2 { animation: scale3 2s infinite linear; animation-delay: 1s }
.play_btn .l3 { animation: scale3 2s infinite linear; animation-delay: 2s }
@-webkit-keyframes scale1 { from {
padding:0px;
opacity:1
}
to { padding: 10px; opacity: 0 }
}
@-webkit-keyframes scale2 { from {
padding:0px;
opacity:1
}
to { padding: 15px; opacity: 0 }
}
@-webkit-keyframes scale3 { from {
padding:0px;
opacity:1
}
to { padding: 20px; opacity: 0 }
}
.sub_fixed_menu { height: 300px; position: fixed; right: 0; top: 50%; margin-top: -98px; z-index: 999999 }
@media (max-width:480px) {
.sub_fixed_menu { display: none }
}
.sub_fixed_menu * { box-sizing: content-box }
.sub_fixed_menu .nav { position: relative }
.sub_fixed_menu li { width: 68px; background: #fff; position: relative; margin-bottom: 4px; text-align: center; font-size: 12px; overflow: hidden; box-shadow: 0 0 5px rgba(0,0,0,0.1) }
.sub_fixed_menu li .inner { height: 68px; display: flex; align-items: center; flex-direction: column; justify-content: center }
.sub_fixed_menu li .inner { color: #808080; text-decoration: none; padding: 0 }
.sub_fixed_menu li .top { color: #E62129 }
.sub_fixed_menu li:hover .inner { color: #E62129 }
.sub_fixed_menu li:hover i { left: -30px; border-right: 30px solid transparent; -webkit-filter: drop-shadow(30px 0 0 #E62129); filter: drop-shadow(30px 0 0 #E62129) }
.sub_fixed_menu .icon { width: 30px; height: 30px; display: block; margin: 0 auto 5px; position: relative; overflow: hidden }
.sub_fixed_menu .icon i { background-repeat: no-repeat; background-position: center; position: absolute; width: 100%; height: 100%; left: 0; top: 0 }
.sub_fixed_menu .icon .ic_tel { background-image: url('../images/sub_1.png') }
.sub_fixed_menu .icon .ic_service { background-image: url('../images/sub_2.png') }
.sub_fixed_menu .icon .ic_wechat { background-image: url('../images/sub_3.png') }
.sub_fixed_menu .icon .ic_top { background-image: url('../images/sub_4.png') }
.sub_fixed_menu .drop { position: absolute; opacity: 0; top: 50%; transform: translateY(-50%) translateX(-100%); left: 0; white-space: nowrap; font-size: 14px; padding-right: 20px; transition-duration: .6s; transition-property: all; transition-timing-function: ease-out }
.sub_fixed_menu .drop::after { content: ''; display: block; position: absolute; width: 0; height: 0; border: 10px solid transparent; border-left-color: #fff; right: 2px; top: 50%; border-left-width: 14px; transform: translateY(-50%) }
.sub_fixed_menu .drop .dropinner { display: block; background: #fff; box-shadow: 0 0 10px rgba(0,0,0,0.2); box-shadow: 0 0 10px rgba(0,0,0,0.1) }
.sub_fixed_menu .drop .tel_inner { line-height: 36px; padding: 0 18px }
.sub_fixed_menu .drop .code_inner img { max-width: 100px; max-height: 100px }
.sub_fixed_menu li:hover { overflow: visible }
.sub_fixed_menu li:hover .drop { opacity: 1 }
.company_data { text-align: center; padding: 1rem 0 0 }
.company_data h2 { font-size:.36rem;
margin-bottom:.3rem
}
@media (max-width:640px) {
.company_data h2 { font-size: 22px }
}
.company_data ul { display: flex; flex-wrap: wrap; margin: 0 auto; justify-content: center }
.company_data .list1 li {
padding:.18rem; width: 14.2% }
.company_data .list1 li img { width: 1.9rem }
@media (max-width:1200px) {
.company_data .list1 { max-width: 80vw }
.company_data .list1 li { width: 25% }
.company_data .list1 li img { width: 100% }
}
@media (max-width:480px) {
.company_data .list1 { max-width: 100%; justify-content: start }
.company_data .list1 li { width: 33.33% }
}
.company_data .list2 { padding-bottom: 0rem }
.company_data .list2 img { width: 2.7rem }
.company_data .list2 li { padding:.09rem
}
@media (max-width:992px) {
.company_data .list2 li { width: 25% }
.company_data .list2 li img { width: 100% }
}
@media (max-width:480px) {
.company_data .list2 li { width: 50% }
.company_data .list2 li img { width: 100% }
}